<!doctype html><html lang="en">
 <head>
  <meta content="text/html; charset=utf-8" http-equiv="Content-Type">
  <title>Web Locks API</title>
  <meta content="width=device-width, initial-scale=1, shrink-to-fit=no" name="viewport">
<style data-fill-with="stylesheet">/******************************************************************************
 *                   Style sheet for the W3C specifications                   *
 *
 * Special classes handled by this style sheet include:
 *
 * Indices
 *   - .toc for the Table of Contents (<ol class="toc">)
 *     + <span class="secno"> for the section numbers
 *   - #toc for the Table of Contents (<nav id="toc">)
 *   - ul.index for Indices (<a href="#ref">term</a><span>, in §N.M</span>)
 *   - table.index for Index Tables (e.g. for properties or elements)
 *
 * Structural Markup
 *   - table.data for general data tables
 *     -> use 'scope' attribute, <colgroup>, <thead>, and <tbody> for best results !
 *     -> use <table class='complex data'> for extra-complex tables
 *     -> use <td class='long'> for paragraph-length cell content
 *     -> use <td class='pre'> when manual line breaks/indentation would help readability
 *   - dl.switch for switch statements
 *   - ol.algorithm for algorithms (helps to visualize nesting)
 *   - .figure and .caption (HTML4) and figure and figcaption (HTML5)
 *     -> .sidefigure for right-floated figures
 *   - ins/del
 *
 * Code
 *   - pre and code
 *
 * Special Sections
 *   - .note       for informative notes             (div, p, span, aside, details)
 *   - .example    for informative examples          (div, p, pre, span)
 *   - .issue      for issues                        (div, p, span)
 *   - .assertion  for assertions                    (div, p, span)
 *   - .advisement for loud normative statements     (div, p, strong)
 *   - .annoying-warning for spec obsoletion notices (div, aside, details)
 *
 * Definition Boxes
 *   - pre.def   for WebIDL definitions
 *   - table.def for tables that define other entities (e.g. CSS properties)
 *   - dl.def    for definition lists that define other entitles (e.g. HTML elements)
 *
 * Numbering
 *   - .secno for section numbers in .toc and headings (<span class='secno'>3.2</span>)
 *   - .marker for source-inserted example/figure/issue numbers (<span class='marker'>Issue 4</span>)
 *   - ::before styled for CSS-generated issue/example/figure numbers:
 *     -> Documents wishing to use this only need to add
 *        figcaption::before,
 *        .caption::before { content: "Figure "  counter(figure) " ";  }
 *        .example::before { content: "Example " counter(example) " "; }
 *        .issue::before   { content: "Issue "   counter(issue) " ";   }
 *
 * Header Stuff (ignore, just don't conflict with these classes)
 *   - .head for the header
 *   - .copyright for the copyright
 *
 * Miscellaneous
 *   - .overlarge for things that should be as wide as possible, even if
 *     that overflows the body text area. This can be used on an item or
 *     on its container, depending on the effect desired.
 *     Note that this styling basically doesn't help at all when printing,
 *     since A4 paper isn't much wider than the max-width here.
 *     It's better to design things to fit into a narrower measure if possible.
 *   - js-added ToC jump links (see fixup.js)
 *
 ******************************************************************************/

/******************************************************************************/
/*                                   Body                                     */
/******************************************************************************/

	body {
		counter-reset: example figure issue;

		/* Layout */
		max-width: 50em;               /* limit line length to 50em for readability   */
		margin: 0 auto;                /* center text within page                     */
		padding: 1.6em 1.5em 2em 50px; /* assume 16px font size for downlevel clients */
		padding: 1.6em 1.5em 2em calc(26px + 1.5em); /* leave space for status flag     */

		/* Typography */
		line-height: 1.5;
		font-family: sans-serif;
		widows: 2;
		orphans: 2;
		word-wrap: break-word;
		overflow-wrap: break-word;
		hyphens: auto;

		/* Colors */
		color: black;
		background: white top left fixed no-repeat;
		background-size: 25px auto;
	}


/******************************************************************************/
/*                         Front Matter & Navigation                          */
/******************************************************************************/

/** Header ********************************************************************/

	div.head { margin-bottom: 1em }
	div.head hr { border-style: solid; }

	div.head h1 {
		font-weight: bold;
		margin: 0 0 .1em;
		font-size: 220%;
	}

	div.head h2 { margin-bottom: 1.5em;}

/** W3C Logo ******************************************************************/

	.head .logo {
		float: right;
		margin: 0.4rem 0 0.2rem .4rem;
	}

	.head img[src*="logos/W3C"] {
		display: block;
		border: solid #1a5e9a;
		border-width: .65rem .7rem .6rem;
		border-radius: .4rem;
		background: #1a5e9a;
		color: white;
		font-weight: bold;
	}

	.head a:hover > img[src*="logos/W3C"],
	.head a:focus > img[src*="logos/W3C"] {
		opacity: .8;
	}

	.head a:active > img[src*="logos/W3C"] {
		background: #c00;
		border-color: #c00;
	}

	/* see also additional rules in Link Styling section */

/** Copyright *****************************************************************/

	p.copyright,
	p.copyright small { font-size: small }

/** Back to Top / ToC Toggle **************************************************/

	@media print {
		#toc-nav {
			display: none;
		}
	}
	@media not print {
		#toc-nav {
			position: fixed;
			z-index: 2;
			bottom: 0; left: 0;
			margin: 0;
			min-width: 1.33em;
			border-top-right-radius: 2rem;
			box-shadow: 0 0 2px;
			font-size: 1.5em;
			color: black;
		}
		#toc-nav > a {
			display: block;
			white-space: nowrap;

			height: 1.33em;
			padding: .1em 0.3em;
			margin: 0;

			background: white;
			box-shadow: 0 0 2px;
			border: none;
			border-top-right-radius: 1.33em;
			background: white;
		}
		#toc-nav > #toc-jump {
			padding-bottom: 2em;
			margin-bottom: -1.9em;
		}

		#toc-nav > a:hover,
		#toc-nav > a:focus {
			background: #f8f8f8;
		}
		#toc-nav > a:not(:hover):not(:focus) {
			color: #707070;
		}

		/* statusbar gets in the way on keyboard focus; remove once browsers fix */
		#toc-nav > a[href="#toc"]:not(:hover):focus:last-child {
			padding-bottom: 1.5rem;
		}

		#toc-nav:not(:hover) > a:not(:focus) > span + span {
			/* Ideally this uses :focus-within on #toc-nav */
			display: none;
		}
		#toc-nav > a > span + span {
			padding-right: 0.2em;
		}

		#toc-toggle-inline {
			vertical-align: 0.05em;
			font-size: 80%;
			color: gray;
			color: hsla(203,20%,40%,.7);
			border-style: none;
			background: transparent;
			position: relative;
		}
		#toc-toggle-inline:hover:not(:active),
		#toc-toggle-inline:focus:not(:active) {
			text-shadow: 1px 1px silver;
			top: -1px;
			left: -1px;
		}

		#toc-nav :active {
			color: #C00;
		}
	}

/** ToC Sidebar ***************************************************************/

	/* Floating sidebar */
	@media screen {
		body.toc-sidebar #toc {
			position: fixed;
			top: 0; bottom: 0;
			left: 0;
			width: 23.5em;
			max-width: 80%;
			max-width: calc(100% - 2em - 26px);
			overflow: auto;
			padding: 0 1em;
			padding-left: 42px;
			padding-left: calc(1em + 26px);
			background: inherit;
			background-color: #f7f8f9;
			z-index: 1;
			box-shadow: -.1em 0 .25em rgba(0,0,0,.1) inset;
		}
		body.toc-sidebar #toc h2 {
			margin-top: .8rem;
			font-variant: small-caps;
			font-variant: all-small-caps;
			text-transform: lowercase;
			font-weight: bold;
			color: gray;
			color: hsla(203,20%,40%,.7);
		}
		body.toc-sidebar #toc-jump:not(:focus) {
			width: 0;
			height: 0;
			padding: 0;
			position: absolute;
			overflow: hidden;
		}
	}
	/* Hide main scroller when only the ToC is visible anyway */
	@media screen and (max-width: 28em) {
		body.toc-sidebar {
			overflow: hidden;
		}
	}

	/* Sidebar with its own space */
	@media screen and (min-width: 78em) {
		body:not(.toc-inline) #toc {
			position: fixed;
			top: 0; bottom: 0;
			left: 0;
			width: 23.5em;
			overflow: auto;
			padding: 0 1em;
			padding-left: 42px;
			padding-left: calc(1em + 26px);
			background: inherit;
			background-color: #f7f8f9;
			z-index: 1;
			box-shadow: -.1em 0 .25em rgba(0,0,0,.1) inset;
		}
		body:not(.toc-inline) #toc h2 {
			margin-top: .8rem;
			font-variant: small-caps;
			font-variant: all-small-caps;
			text-transform: lowercase;
			font-weight: bold;
			color: gray;
			color: hsla(203,20%,40%,.7);
		}

		body:not(.toc-inline) {
			padding-left: 29em;
		}
		/* See also Overflow section at the bottom */

		body:not(.toc-inline) #toc-jump:not(:focus) {
			width: 0;
			height: 0;
			padding: 0;
			position: absolute;
			overflow: hidden;
		}
	}
	@media screen and (min-width: 90em) {
		body:not(.toc-inline) {
			margin: 0 4em;
		}
	}

/******************************************************************************/
/*                                Sectioning                                  */
/******************************************************************************/

/** Headings ******************************************************************/

	h1, h2, h3, h4, h5, h6, dt {
		page-break-after: avoid;
		page-break-inside: avoid;
		font: 100% sans-serif;   /* Reset all font styling to clear out UA styles */
		font-family: inherit;    /* Inherit the font family. */
		line-height: 1.2;        /* Keep wrapped headings compact */
		hyphens: manual;         /* Hyphenated headings look weird */
	}

	h2, h3, h4, h5, h6 {
		margin-top: 3rem;
	}

	h1, h2, h3 {
		color: #005A9C;
		background: transparent;
	}

	h1 { font-size: 170%; }
	h2 { font-size: 140%; }
	h3 { font-size: 120%; }
	h4 { font-weight: bold; }
	h5 { font-style: italic; }
	h6 { font-variant: small-caps; }
	dt { font-weight: bold; }

/** Subheadings ***************************************************************/

	h1 + h2,
	#subtitle {
		/* #subtitle is a subtitle in an H2 under the H1 */
		margin-top: 0;
	}
	h2 + h3,
	h3 + h4,
	h4 + h5,
	h5 + h6 {
		margin-top: 1.2em; /* = 1 x line-height */
	}

/** Section divider ***********************************************************/

	:not(.head) > hr {
		font-size: 1.5em;
		text-align: center;
		margin: 1em auto;
		height: auto;
		border: transparent solid 0;
		background: transparent;
	}
	:not(.head) > hr::before {
		content: "\2727\2003\2003\2727\2003\2003\2727";
	}

/******************************************************************************/
/*                            Paragraphs and Lists                            */
/******************************************************************************/

	p {
		margin: 1em 0;
	}

	dd > p:first-child,
	li > p:first-child {
		margin-top: 0;
	}

	ul, ol {
		margin-left: 0;
		padding-left: 2em;
	}

	li {
		margin: 0.25em 0 0.5em;
		padding: 0;
	}

	dl dd {
		margin: 0 0 .5em 2em;
	}

	.head dd + dd { /* compact for header */
		margin-top: -.5em;
	}

	/* Style for algorithms */
	ol.algorithm ol:not(.algorithm),
	.algorithm > ol ol:not(.algorithm) {
	 border-left: 0.5em solid #DEF;
	}

	/* Put nice boxes around each algorithm. */
	[data-algorithm]:not(.heading) {
	  padding: .5em;
	  border: thin solid #ddd; border-radius: .5em;
	  margin: .5em calc(-0.5em - 1px);
	}
	[data-algorithm]:not(.heading) > :first-child {
	  margin-top: 0;
	}
	[data-algorithm]:not(.heading) > :last-child {
	  margin-bottom: 0;
	}

	/* Style for switch/case <dl>s */
	dl.switch > dd > ol.only,
	dl.switch > dd > .only > ol {
	 margin-left: 0;
	}
	dl.switch > dd > ol.algorithm,
	dl.switch > dd > .algorithm > ol {
	 margin-left: -2em;
	}
	dl.switch {
	 padding-left: 2em;
	}
	dl.switch > dt {
	 text-indent: -1.5em;
	 margin-top: 1em;
	}
	dl.switch > dt + dt {
	 margin-top: 0;
	}
	dl.switch > dt::before {
	 content: '\21AA';
	 padding: 0 0.5em 0 0;
	 display: inline-block;
	 width: 1em;
	 text-align: right;
	 line-height: 0.5em;
	}

/** Terminology Markup ********************************************************/


/******************************************************************************/
/*                                 Inline Markup                              */
/******************************************************************************/

/** Terminology Markup ********************************************************/
	dfn   { /* Defining instance */
		font-weight: bolder;
	}
	a > i { /* Instance of term */
		font-style: normal;
	}
	dt dfn code, code.idl {
		font-size: medium;
	}
	dfn var {
		font-style: normal;
	}

/** Change Marking ************************************************************/

	del { color: red;  text-decoration: line-through; }
	ins { color: #080; text-decoration: underline;    }

/** Miscellaneous improvements to inline formatting ***************************/

	sup {
		vertical-align: super;
		font-size: 80%
	}

/******************************************************************************/
/*                                    Code                                    */
/******************************************************************************/

/** General monospace/pre rules ***********************************************/

	pre, code, samp {
		font-family: Menlo, Consolas, "DejaVu Sans Mono", Monaco, monospace;
		font-size: .9em;
		page-break-inside: avoid;
		hyphens: none;
		text-transform: none;
	}
	pre code,
	code code {
		font-size: 100%;
	}

	pre {
		margin-top: 1em;
		margin-bottom: 1em;
		overflow: auto;
	}

/** Inline Code fragments *****************************************************/

  /* Do something nice. */

/******************************************************************************/
/*                                    Links                                   */
/******************************************************************************/

/** General Hyperlinks ********************************************************/

	/* We hyperlink a lot, so make it less intrusive */
	a[href] {
		color: #034575;
		text-decoration: none;
		border-bottom: 1px solid #707070;
		/* Need a bit of extending for it to look okay */
		padding: 0 1px 0;
		margin: 0 -1px 0;
	}
	a:visited {
		border-bottom-color: #BBB;
	}

	/* Use distinguishing colors when user is interacting with the link */
	a[href]:focus,
	a[href]:hover {
		background: #f8f8f8;
		background: rgba(75%, 75%, 75%, .25);
		border-bottom-width: 3px;
		margin-bottom: -2px;
	}
	a[href]:active {
		color: #C00;
		border-color: #C00;
	}

	/* Backout above styling for W3C logo */
	.head .logo,
	.head .logo a {
		border: none;
		text-decoration: none;
		background: transparent;
	}

/******************************************************************************/
/*                                    Images                                  */
/******************************************************************************/

	img {
		border-style: none;
	}

	/* For autogen numbers, add
	   .caption::before, figcaption::before { content: "Figure " counter(figure) ". "; }
	*/

	figure, .figure, .sidefigure {
		page-break-inside: avoid;
		text-align: center;
		margin: 2.5em 0;
	}
	.figure img,    .sidefigure img,    figure img,
	.figure object, .sidefigure object, figure object {
		max-width: 100%;
		margin: auto;
	}
	.figure pre, .sidefigure pre, figure pre {
		text-align: left;
		display: table;
		margin: 1em auto;
	}
	.figure table, figure table {
		margin: auto;
	}
	@media screen and (min-width: 20em) {
		.sidefigure {
			float: right;
			width: 50%;
			margin: 0 0 0.5em 0.5em
		}
	}
	.caption, figcaption, caption {
		font-style: italic;
		font-size: 90%;
	}
	.caption::before, figcaption::before, figcaption > .marker {
		font-weight: bold;
	}
	.caption, figcaption {
		counter-increment: figure;
	}

	/* DL list is indented 2em, but figure inside it is not */
	dd > .figure, dd > figure { margin-left: -2em }

/******************************************************************************/
/*                             Colored Boxes                                  */
/******************************************************************************/

	.issue, .note, .example, .assertion, .advisement, blockquote {
		padding: .5em;
		border: .5em;
		border-left-style: solid;
		page-break-inside: avoid;
	}
	span.issue, span.note {
		padding: .1em .5em .15em;
		border-right-style: solid;
	}

	.issue,
	.note,
	.example,
	.advisement,
	.assertion,
	blockquote {
		margin: 1em auto;
	}
	.note  > p:first-child,
	.issue > p:first-child,
	blockquote > :first-child {
		margin-top: 0;
	}
	blockquote > :last-child {
		margin-bottom: 0;
	}

/** Blockquotes ***************************************************************/

	blockquote {
		border-color: silver;
	}

/** Open issue ****************************************************************/

	.issue {
		border-color: #E05252;
		background: #FBE9E9;
		counter-increment: issue;
		overflow: auto;
	}
	.issue::before, .issue > .marker {
		text-transform: uppercase;
		color: #AE1E1E;
		padding-right: 1em;
		text-transform: uppercase;
	}
	/* Add .issue::before { content: "Issue " counter(issue) " "; } for autogen numbers,
	   or use class="marker" to mark up the issue number in source. */

/** Example *******************************************************************/

	.example {
		border-color: #E0CB52;
		background: #FCFAEE;
		counter-increment: example;
		overflow: auto;
		clear: both;
	}
	.example::before, .example > .marker {
		text-transform: uppercase;
		color: #827017;
		min-width: 7.5em;
		display: block;
	}
	/* Add .example::before { content: "Example " counter(example) " "; } for autogen numbers,
	   or use class="marker" to mark up the example number in source. */

/** Non-normative Note ********************************************************/

	.note {
		border-color: #52E052;
		background: #E9FBE9;
		overflow: auto;
	}

	.note::before, .note > .marker,
	details.note > summary::before,
	details.note > summary > .marker {
		text-transform: uppercase;
		display: block;
		color: hsl(120, 70%, 30%);
	}
	/* Add .note::before { content: "Note"; } for autogen label,
	   or use class="marker" to mark up the label in source. */

	details.note > summary {
		display: block;
		color: hsl(120, 70%, 30%);
	}
	details.note[open] > summary {
		border-bottom: 1px silver solid;
	}

/** Assertion Box *************************************************************/
	/*  for assertions in algorithms */

	.assertion {
		border-color: #AAA;
		background: #EEE;
	}

/** Advisement Box ************************************************************/
	/*  for attention-grabbing normative statements */

	.advisement {
		border-color: orange;
		border-style: none solid;
		background: #FFEECC;
	}
	strong.advisement {
		display: block;
		text-align: center;
	}
	.advisement > .marker {
		color: #B35F00;
	}

/** Spec Obsoletion Notice ****************************************************/
	/* obnoxious obsoletion notice for older/abandoned specs. */

	details {
		display: block;
	}
	summary {
		font-weight: bolder;
	}

	.annoying-warning:not(details),
	details.annoying-warning:not([open]) > summary,
	details.annoying-warning[open] {
		background: #fdd;
		color: red;
		font-weight: bold;
		padding: .75em 1em;
		border: thick red;
		border-style: solid;
		border-radius: 1em;
	}
	.annoying-warning :last-child {
		margin-bottom: 0;
	}

@media not print {
	details.annoying-warning[open] {
		position: fixed;
		left: 1em;
		right: 1em;
		bottom: 1em;
		z-index: 1000;
	}
}

	details.annoying-warning:not([open]) > summary {
		text-align: center;
	}

/** Entity Definition Boxes ***************************************************/

	.def {
		padding: .5em 1em;
		background: #DEF;
		margin: 1.2em 0;
		border-left: 0.5em solid #8CCBF2;
	}

/******************************************************************************/
/*                                    Tables                                  */
/******************************************************************************/

	th, td {
		text-align: left;
		text-align: start;
	}

/** Property/Descriptor Definition Tables *************************************/

	table.def {
		/* inherits .def box styling, see above */
		width: 100%;
		border-spacing: 0;
	}

	table.def td,
	table.def th {
		padding: 0.5em;
		vertical-align: baseline;
		border-bottom: 1px solid #bbd7e9;
	}

	table.def > tbody > tr:last-child th,
	table.def > tbody > tr:last-child td {
		border-bottom: 0;
	}

	table.def th {
		font-style: italic;
		font-weight: normal;
		padding-left: 1em;
		width: 3em;
	}

	/* For when values are extra-complex and need formatting for readability */
	table td.pre {
		white-space: pre-wrap;
	}

	/* A footnote at the bottom of a def table */
	table.def           td.footnote {
		padding-top: 0.6em;
	}
	table.def           td.footnote::before {
		content: " ";
		display: block;
		height: 0.6em;
		width: 4em;
		border-top: thin solid;
	}

/** Data tables (and properly marked-up index tables) *************************/
	/*
		 <table class="data"> highlights structural relationships in a table
		 when correct markup is used (e.g. thead/tbody, th vs. td, scope attribute)

		 Use class="complex data" for particularly complicated tables --
		 (This will draw more lines: busier, but clearer.)

		 Use class="long" on table cells with paragraph-like contents
		 (This will adjust text alignment accordingly.)
		 Alternately use class="longlastcol" on tables, to have the last column assume "long".
	*/

	table {
		word-wrap: normal;
		overflow-wrap: normal;
		hyphens: manual;
	}

	table.data,
	table.index {
		margin: 1em auto;
		border-collapse: collapse;
		border: hidden;
		width: 100%;
	}
	table.data caption,
	table.index caption {
		max-width: 50em;
		margin: 0 auto 1em;
	}

	table.data td,  table.data th,
	table.index td, table.index th {
		padding: 0.5em 1em;
		border-width: 1px;
		border-color: silver;
		border-top-style: solid;
	}

	table.data thead td:empty {
		padding: 0;
		border: 0;
	}

	table.data  thead,
	table.index thead,
	table.data  tbody,
	table.index tbody {
		border-bottom: 2px solid;
	}

	table.data colgroup,
	table.index colgroup {
		border-left: 2px solid;
	}

	table.data  tbody th:first-child,
	table.index tbody th:first-child  {
		border-right: 2px solid;
		border-top: 1px solid silver;
		padding-right: 1em;
	}

	table.data th[colspan],
	table.data td[colspan] {
		text-align: center;
	}

	table.complex.data th,
	table.complex.data td {
		border: 1px solid silver;
		text-align: center;
	}

	table.data.longlastcol td:last-child,
	table.data td.long {
	 vertical-align: baseline;
	 text-align: left;
	}

	table.data img {
		vertical-align: middle;
	}


/*
Alternate table alignment rules

	table.data,
	table.index {
		text-align: center;
	}

	table.data  thead th[scope="row"],
	table.index thead th[scope="row"] {
		text-align: right;
	}

	table.data  tbody th:first-child,
	table.index tbody th:first-child  {
		text-align: right;
	}

Possible extra rowspan handling

	table.data  tbody th[rowspan]:not([rowspan='1']),
	table.index tbody th[rowspan]:not([rowspan='1']),
	table.data  tbody td[rowspan]:not([rowspan='1']),
	table.index tbody td[rowspan]:not([rowspan='1']) {
		border-left: 1px solid silver;
	}

	table.data  tbody th[rowspan]:first-child,
	table.index tbody th[rowspan]:first-child,
	table.data  tbody td[rowspan]:first-child,
	table.index tbody td[rowspan]:first-child{
		border-left: 0;
		border-right: 1px solid silver;
	}
*/

/******************************************************************************/
/*                                  Indices                                   */
/******************************************************************************/


/** Table of Contents *********************************************************/

	.toc a {
		/* More spacing; use padding to make it part of the click target. */
		padding-top: 0.1rem;
		/* Larger, more consistently-sized click target */
		display: block;
		/* Reverse color scheme */
		color: black;
		border-color: #3980B5;
		border-bottom-width: 3px !important;
		margin-bottom: 0px !important;
	}
	.toc a:visited {
		border-color: #054572;
	}
	.toc a:not(:focus):not(:hover) {
		/* Allow colors to cascade through from link styling */
		border-bottom-color: transparent;
	}

	.toc, .toc ol, .toc ul, .toc li {
		list-style: none; /* Numbers must be inlined into source */
		/* because generated content isn't search/selectable and markers can't do multilevel yet */
		margin:  0;
		padding: 0;
		line-height: 1.1rem; /* consistent spacing */
	}

	/* ToC not indented until third level, but font style & margins show hierarchy */
	.toc > li             { font-weight: bold;   }
	.toc > li li          { font-weight: normal; }
	.toc > li li li       { font-size:   95%;    }
	.toc > li li li li    { font-size:   90%;    }
	.toc > li li li li .secno { font-size: 85%; }
	.toc > li li li li li { font-size:   85%;    }
	.toc > li li li li li .secno { font-size: 100%; }

	/* @supports not (display:grid) { */
		.toc > li             { margin: 1.5rem 0;    }
		.toc > li li          { margin: 0.3rem 0;    }
		.toc > li li li       { margin-left: 2rem;   }

		/* Section numbers in a column of their own */
		.toc .secno {
			float: left;
			width: 4rem;
			white-space: nowrap;
		}

		.toc li {
			clear: both;
		}

		:not(li) > .toc              { margin-left:  5rem; }
		.toc .secno                  { margin-left: -5rem; }
		.toc > li li li .secno       { margin-left: -7rem; }
		.toc > li li li li .secno    { margin-left: -9rem; }
		.toc > li li li li li .secno { margin-left: -11rem; }

		/* Tighten up indentation in narrow ToCs */
		@media (max-width: 30em) {
			:not(li) > .toc              { margin-left:  4rem; }
			.toc .secno                  { margin-left: -4rem; }
			.toc > li li li              { margin-left:  1rem; }
			.toc > li li li .secno       { margin-left: -5rem; }
			.toc > li li li li .secno    { margin-left: -6rem; }
			.toc > li li li li li .secno { margin-left: -7rem; }
		}
	/* } */

	@supports (display:grid) and (display:contents) {
		/* Use #toc over .toc to override non-@supports rules. */
		#toc {
			display: grid;
			align-content: start;
			grid-template-columns: auto 1fr;
			grid-column-gap: 1rem;
			column-gap: 1rem;
			grid-row-gap: .6rem;
			row-gap: .6rem;
		}
		#toc h2 {
			grid-column: 1 / -1;
			margin-bottom: 0;
		}
		#toc ol,
		#toc li,
		#toc a {
			display: contents;
			/* Switch <a> to subgrid when supported */
		}
		#toc span {
			margin: 0;
		}
		#toc > .toc > li > a > span {
			/* The spans of the top-level list,
			   comprising the first items of each top-level section. */
			margin-top: 1.1rem;
		}
		#toc#toc .secno { /* Ugh, need more specificity to override base.css */
			grid-column: 1;
			width: auto;
			margin-left: 0;
		}
		#toc .content {
			grid-column: 2;
			width: auto;
			margin-right: 1rem;
		}
		#toc .content:hover {
			background: rgba(75%, 75%, 75%, .25);
			border-bottom: 3px solid #054572;
			margin-bottom: -3px;
		}
		#toc li li li .content {
			margin-left: 1rem;
		}
		#toc li li li li .content {
			margin-left: 2rem;
		}
	}


/** Index *********************************************************************/

	/* Index Lists: Layout */
	ul.index       { margin-left: 0; columns: 15em; text-indent: 1em hanging; }
	ul.index li    { margin-left: 0; list-style: none; break-inside: avoid; }
	ul.index li li { margin-left: 1em }
	ul.index dl    { margin-top: 0; }
	ul.index dt    { margin: .2em 0 .2em 20px;}
	ul.index dd    { margin: .2em 0 .2em 40px;}
	/* Index Lists: Typography */
	ul.index ul,
	ul.index dl { font-size: smaller; }
	@media not print {
		ul.index li span {
			white-space: nowrap;
			color: transparent; }
		ul.index li a:hover + span,
		ul.index li a:focus + span {
			color: #707070;
		}
	}

/** Index Tables *****************************************************/
	/* See also the data table styling section, which this effectively subclasses */

	table.index {
		font-size: small;
		border-collapse: collapse;
		border-spacing: 0;
		text-align: left;
		margin: 1em 0;
	}

	table.index td,
	table.index th {
		padding: 0.4em;
	}

	table.index tr:hover td:not([rowspan]),
	table.index tr:hover th:not([rowspan]) {
		background: #f7f8f9;
	}

	/* The link in the first column in the property table (formerly a TD) */
	table.index th:first-child a {
		font-weight: bold;
	}

/******************************************************************************/
/*                                    Print                                   */
/******************************************************************************/

	@media print {
		/* Pages have their own margins. */
		html {
			margin: 0;
		}
		/* Serif for print. */
		body {
			font-family: serif;
		}
	}
	@page {
		margin: 1.5cm 1.1cm;
	}

/******************************************************************************/
/*                                    Legacy                                  */
/******************************************************************************/

	/* This rule is inherited from past style sheets. No idea what it's for. */
	.hide { display: none }



/******************************************************************************/
/*                             Overflow Control                               */
/******************************************************************************/

	.figure .caption, .sidefigure .caption, figcaption {
		/* in case figure is overlarge, limit caption to 50em */
		max-width: 50rem;
		margin-left: auto;
		margin-right: auto;
	}
	.overlarge {
		/* Magic to create good table positioning:
		   "content column" is 50ems wide at max; less on smaller screens.
		   Extra space (after ToC + content) is empty on the right.

		   1. When table < content column, centers table in column.
		   2. When content < table < available, left-aligns.
		   3. When table > available, fills available + scroll bar.
		*/ 
		display: grid;
		grid-template-columns: minmax(0, 50em);
	}
	.overlarge > table {
		/* limit preferred width of table */
		max-width: 50em;
		margin-left: auto;
		margin-right: auto;
	}

	@media (min-width: 55em) {
		.overlarge {
			margin-right: calc(13px + 26.5rem - 50vw);
			max-width: none;
		}
	}
	@media screen and (min-width: 78em) {
		body:not(.toc-inline) .overlarge {
			/* 30.5em body padding 50em content area */
			margin-right: calc(40em - 50vw) !important;
		}
	}
	@media screen and (min-width: 90em) {
		body:not(.toc-inline) .overlarge {
			/* 4em html margin 30.5em body padding 50em content area */
			margin-right: calc(84.5em - 100vw) !important;
		}
	}

	@media not print {
		.overlarge {
			overflow-x: auto;
			/* See Lea Verou's explanation background-attachment:
			 * http://lea.verou.me/2012/04/background-attachment-local/
			 *
			background: top left  / 4em 100% linear-gradient(to right,  #ffffff, rgba(255, 255, 255, 0)) local,
			            top right / 4em 100% linear-gradient(to left, #ffffff, rgba(255, 255, 255, 0)) local,
			            top left  / 1em 100% linear-gradient(to right,  #c3c3c5, rgba(195, 195, 197, 0)) scroll,
			            top right / 1em 100% linear-gradient(to left, #c3c3c5, rgba(195, 195, 197, 0)) scroll,
			            white;
			background-repeat: no-repeat;
			*/
		}
	}
</style>
  <link href="https://www.w3.org/StyleSheets/TR/2016/cg-draft" rel="stylesheet">
  <link href="https://wicg.github.io/web-locks/" rel="canonical">
  <link href="logo-lock.png" rel="icon">
<style>
dl.domintro dt {
    font-family: Menlo, Consolas, "DejaVu Sans Mono", Monaco, monospace;

    padding-top: 0.5em;
    padding-bottom: 1em;
}
dl.domintro dt a {
    color: inherit; border-bottom-style: none;
}
dl.domintro dt code {
    font-size: inherit;
}
</style>
<style>/* style-md-lists */

/* This is a weird hack for me not yet following the commonmark spec
   regarding paragraph and lists. */
[data-md] > :first-child {
    margin-top: 0;
}
[data-md] > :last-child {
    margin-bottom: 0;
}</style>
<style>/* style-selflinks */

.heading, .issue, .note, .example, li, dt {
    position: relative;
}
a.self-link {
    position: absolute;
    top: 0;
    left: calc(-1 * (3.5rem - 26px));
    width: calc(3.5rem - 26px);
    height: 2em;
    text-align: center;
    border: none;
    transition: opacity .2s;
    opacity: .5;
}
a.self-link:hover {
    opacity: 1;
}
.heading > a.self-link {
    font-size: 83%;
}
li > a.self-link {
    left: calc(-1 * (3.5rem - 26px) - 2em);
}
dfn > a.self-link {
    top: auto;
    left: auto;
    opacity: 0;
    width: 1.5em;
    height: 1.5em;
    background: gray;
    color: white;
    font-style: normal;
    transition: opacity .2s, background-color .2s, color .2s;
}
dfn:hover > a.self-link {
    opacity: 1;
}
dfn > a.self-link:hover {
    color: black;
}

a.self-link::before            { content: "¶"; }
.heading > a.self-link::before { content: "§"; }
dfn > a.self-link::before      { content: "#"; }</style>
<style>/* style-counters */

body {
    counter-reset: example figure issue;
}
.issue {
    counter-increment: issue;
}
.issue:not(.no-marker)::before {
    content: "Issue " counter(issue);
}

.example {
    counter-increment: example;
}
.example:not(.no-marker)::before {
    content: "Example " counter(example);
}
.invalid.example:not(.no-marker)::before,
.illegal.example:not(.no-marker)::before {
    content: "Invalid Example" counter(example);
}

figcaption {
    counter-increment: figure;
}
figcaption:not(.no-marker)::before {
    content: "Figure " counter(figure) " ";
}</style>
<style>/* style-autolinks */

.css.css, .property.property, .descriptor.descriptor {
    color: #005a9c;
    font-size: inherit;
    font-family: inherit;
}
.css::before, .property::before, .descriptor::before {
    content: "‘";
}
.css::after, .property::after, .descriptor::after {
    content: "’";
}
.property, .descriptor {
    /* Don't wrap property and descriptor names */
    white-space: nowrap;
}
.type { /* CSS value <type> */
    font-style: italic;
}
pre .property::before, pre .property::after {
    content: "";
}
[data-link-type="property"]::before,
[data-link-type="propdesc"]::before,
[data-link-type="descriptor"]::before,
[data-link-type="value"]::before,
[data-link-type="function"]::before,
[data-link-type="at-rule"]::before,
[data-link-type="selector"]::before,
[data-link-type="maybe"]::before {
    content: "‘";
}
[data-link-type="property"]::after,
[data-link-type="propdesc"]::after,
[data-link-type="descriptor"]::after,
[data-link-type="value"]::after,
[data-link-type="function"]::after,
[data-link-type="at-rule"]::after,
[data-link-type="selector"]::after,
[data-link-type="maybe"]::after {
    content: "’";
}

[data-link-type].production::before,
[data-link-type].production::after,
.prod [data-link-type]::before,
.prod [data-link-type]::after {
    content: "";
}

[data-link-type=element],
[data-link-type=element-attr] {
    font-family: Menlo, Consolas, "DejaVu Sans Mono", monospace;
    font-size: .9em;
}
[data-link-type=element]::before { content: "<" }
[data-link-type=element]::after  { content: ">" }

[data-link-type=biblio] {
    white-space: pre;
}</style>
<style>/* style-dfn-panel */

.dfn-panel {
    position: absolute;
    z-index: 35;
    height: auto;
    width: -webkit-fit-content;
    width: fit-content;
    max-width: 300px;
    max-height: 500px;
    overflow: auto;
    padding: 0.5em 0.75em;
    font: small Helvetica Neue, sans-serif, Droid Sans Fallback;
    background: #DDDDDD;
    color: black;
    border: outset 0.2em;
}
.dfn-panel:not(.on) { display: none; }
.dfn-panel * { margin: 0; padding: 0; text-indent: 0; }
.dfn-panel > b { display: block; }
.dfn-panel a { color: black; }
.dfn-panel a:not(:hover) { text-decoration: none !important; border-bottom: none !important; }
.dfn-panel > b + b { margin-top: 0.25em; }
.dfn-panel ul { padding: 0; }
.dfn-panel li { list-style: inside; }
.dfn-panel.activated {
    display: inline-block;
    position: fixed;
    left: .5em;
    bottom: 2em;
    margin: 0 auto;
    max-width: calc(100vw - 1.5em - .4em - .5em);
    max-height: 30vh;
}

.dfn-paneled { cursor: pointer; }
</style>
<style>/* style-syntax-highlighting */
pre.idl.highlight { color: #708090; }
.highlight:not(.idl) { background: hsl(24, 20%, 95%); }
code.highlight { padding: .1em; border-radius: .3em; }
pre.highlight, pre > code.highlight { display: block; padding: 1em; margin: .5em 0; overflow: auto; border-radius: 0; }
c-[a] { color: #990055 } /* Keyword.Declaration */
c-[b] { color: #990055 } /* Keyword.Type */
c-[c] { color: #708090 } /* Comment */
c-[d] { color: #708090 } /* Comment.Multiline */
c-[e] { color: #0077aa } /* Name.Attribute */
c-[f] { color: #669900 } /* Name.Tag */
c-[g] { color: #222222 } /* Name.Variable */
c-[k] { color: #990055 } /* Keyword */
c-[l] { color: #000000 } /* Literal */
c-[m] { color: #000000 } /* Literal.Number */
c-[n] { color: #0077aa } /* Name */
c-[o] { color: #999999 } /* Operator */
c-[p] { color: #999999 } /* Punctuation */
c-[s] { color: #a67f59 } /* Literal.String */
c-[t] { color: #a67f59 } /* Literal.String.Single */
c-[u] { color: #a67f59 } /* Literal.String.Double */
c-[cp] { color: #708090 } /* Comment.Preproc */
c-[c1] { color: #708090 } /* Comment.Single */
c-[cs] { color: #708090 } /* Comment.Special */
c-[kc] { color: #990055 } /* Keyword.Constant */
c-[kn] { color: #990055 } /* Keyword.Namespace */
c-[kp] { color: #990055 } /* Keyword.Pseudo */
c-[kr] { color: #990055 } /* Keyword.Reserved */
c-[ld] { color: #000000 } /* Literal.Date */
c-[nc] { color: #0077aa } /* Name.Class */
c-[no] { color: #0077aa } /* Name.Constant */
c-[nd] { color: #0077aa } /* Name.Decorator */
c-[ni] { color: #0077aa } /* Name.Entity */
c-[ne] { color: #0077aa } /* Name.Exception */
c-[nf] { color: #0077aa } /* Name.Function */
c-[nl] { color: #0077aa } /* Name.Label */
c-[nn] { color: #0077aa } /* Name.Namespace */
c-[py] { color: #0077aa } /* Name.Property */
c-[ow] { color: #999999 } /* Operator.Word */
c-[mb] { color: #000000 } /* Literal.Number.Bin */
c-[mf] { color: #000000 } /* Literal.Number.Float */
c-[mh] { color: #000000 } /* Literal.Number.Hex */
c-[mi] { color: #000000 } /* Literal.Number.Integer */
c-[mo] { color: #000000 } /* Literal.Number.Oct */
c-[sb] { color: #a67f59 } /* Literal.String.Backtick */
c-[sc] { color: #a67f59 } /* Literal.String.Char */
c-[sd] { color: #a67f59 } /* Literal.String.Doc */
c-[se] { color: #a67f59 } /* Literal.String.Escape */
c-[sh] { color: #a67f59 } /* Literal.String.Heredoc */
c-[si] { color: #a67f59 } /* Literal.String.Interpol */
c-[sx] { color: #a67f59 } /* Literal.String.Other */
c-[sr] { color: #a67f59 } /* Literal.String.Regex */
c-[ss] { color: #a67f59 } /* Literal.String.Symbol */
c-[vc] { color: #0077aa } /* Name.Variable.Class */
c-[vg] { color: #0077aa } /* Name.Variable.Global */
c-[vi] { color: #0077aa } /* Name.Variable.Instance */
c-[il] { color: #000000 } /* Literal.Number.Integer.Long */
</style>
 <body class="h-entry">
  <div class="head">
   <p data-fill-with="logo"></p>
   <h1 class="p-name no-ref" id="title">Web Locks API</h1>
   <h2 class="no-num no-toc no-ref heading settled" id="subtitle"><span class="content">Draft Community Group Report, <time class="dt-updated" datetime="1970-01-01">1 January 1970</time></span></h2>
   <div data-fill-with="spec-metadata">
    <dl>
     <dt>This version:
     <dd><a class="u-url" href="https://wicg.github.io/web-locks/">https://wicg.github.io/web-locks/</a>
     <dt>Test Suite:
     <dd><a href="https://github.com/web-platform-tests/wpt/tree/master/web-locks">https://github.com/web-platform-tests/wpt/tree/master/web-locks</a>
     <dt class="editor">Editor:
     <dd class="editor p-author h-card vcard"><a class="p-name fn u-email email" href="mailto:jsbell@google.com">Joshua Bell</a> (<a class="p-org org" href="https://google.com">Google Inc.</a>)
    </dl>
   </div>
   <div data-fill-with="warning"></div>
   <p class="copyright" data-fill-with="copyright"><a href="http://www.w3.org/Consortium/Legal/ipr-notice#Copyright">Copyright</a> © 1970 the Contributors to the Web Locks API Specification, published by the <a href="https://www.w3.org/community/wicg/">Web Platform Incubator Community Group</a> under the <a href="https://www.w3.org/community/about/agreements/cla/">W3C Community Contributor License Agreement (CLA)</a>.
A human-readable <a href="http://www.w3.org/community/about/agreements/cla-deed/">summary</a> is available. </p>
   <hr title="Separator for header">
  </div>
  <div class="p-summary" data-fill-with="abstract">
   <h2 class="no-num no-toc no-ref heading settled" id="abstract"><span class="content">Abstract</span></h2>
   <p>This document defines a web platform API that allows script to asynchronously acquire a lock over a resource, hold it while work is performed, then release it. While held, no other script in the origin can acquire a lock over the same resource. This allows contexts (windows, workers) within a web application to coordinate the usage of resources.</p>
  </div>
  <div data-fill-with="at-risk"></div>
  <h2 class="no-num no-toc no-ref heading settled" id="status"><span class="content">Status of this document</span></h2>
  <div data-fill-with="status">
   <p> This specification was published by the <a href="https://www.w3.org/community/wicg/">Web Platform Incubator Community Group</a>.
  It is not a W3C Standard nor is it on the W3C Standards Track.

  Please note that under the <a href="https://www.w3.org/community/about/agreements/cla/">W3C Community Contributor License Agreement (CLA)</a> there is a limited opt-out and other conditions apply.

  Learn more about <a href="http://www.w3.org/community/">W3C Community and Business Groups</a>. </p>
   <p></p>
  </div>
  <div data-fill-with="at-risk"></div>
  <nav data-fill-with="table-of-contents" id="toc">
   <h2 class="no-num no-toc no-ref" id="contents">Table of Contents</h2>
   <ol class="toc" role="directory">
    <li>
     <a href="#introduction"><span class="secno">1</span> <span class="content">Introduction</span></a>
     <ol class="toc">
      <li><a href="#usage-overview"><span class="secno">1.1</span> <span class="content">Usage Overview</span></a>
      <li><a href="#motivations"><span class="secno">1.2</span> <span class="content">Motivating Use Cases</span></a>
     </ol>
    <li>
     <a href="#concepts"><span class="secno">2</span> <span class="content">Concepts</span></a>
     <ol class="toc">
      <li><a href="#resource-names"><span class="secno">2.1</span> <span class="content">Resources Names</span></a>
      <li><a href="#lock-managers"><span class="secno">2.2</span> <span class="content">Lock Managers</span></a>
      <li><a href="#modes-scheduling"><span class="secno">2.3</span> <span class="content">Modes and Scheduling</span></a>
      <li><a href="#concept-lock"><span class="secno">2.4</span> <span class="content">Locks</span></a>
      <li><a href="#concept-lock-request"><span class="secno">2.5</span> <span class="content">Lock Requests</span></a>
      <li><a href="#agent-integration"><span class="secno">2.6</span> <span class="content">Agent Integration</span></a>
     </ol>
    <li>
     <a href="#api"><span class="secno">3</span> <span class="content">API</span></a>
     <ol class="toc">
      <li><a href="#navigator-mixins"><span class="secno">3.1</span> <span class="content">Navigator Mixins</span></a>
      <li>
       <a href="#api-lock-manager"><span class="secno">3.2</span> <span class="content"><code class="idl"><span>LockManager</span></code> class</span></a>
       <ol class="toc">
        <li><a href="#api-lock-manager-request"><span class="secno">3.2.1</span> <span class="content">The <code class="idl"><span>request()</span></code> method</span></a>
        <li><a href="#api-lock-manager-query"><span class="secno">3.2.2</span> <span class="content">The <code class="idl"><span>query()</span></code> method</span></a>
       </ol>
      <li><a href="#api-lock"><span class="secno">3.3</span> <span class="content"><code class="idl"><span>Lock</span></code> class</span></a>
     </ol>
    <li>
     <a href="#algorithms"><span class="secno">4</span> <span class="content">Algorithms</span></a>
     <ol class="toc">
      <li><a href="#algorithm-request-lock"><span class="secno">4.1</span> <span class="content">Request a lock</span></a>
      <li><a href="#algorithm-release-lock"><span class="secno">4.2</span> <span class="content">Release a lock</span></a>
      <li><a href="#algorithm-abort-request"><span class="secno">4.3</span> <span class="content">Abort a request</span></a>
      <li><a href="#algorithm-process-request"><span class="secno">4.4</span> <span class="content">Process a lock request queue for a given resource name</span></a>
      <li><a href="#algorithm-snapshot-state"><span class="secno">4.5</span> <span class="content">Snapshot the lock state</span></a>
     </ol>
    <li>
     <a href="#usage-considerations"><span class="secno">5</span> <span class="content">Usage Considerations</span></a>
     <ol class="toc">
      <li><a href="#deadlocks"><span class="secno">5.1</span> <span class="content">Deadlocks</span></a>
     </ol>
    <li>
     <a href="#security-privacy"><span class="secno">6</span> <span class="content">Security and Privacy Considerations</span></a>
     <ol class="toc">
      <li><a href="#security-scope"><span class="secno">6.1</span> <span class="content">Lock Scope</span></a>
      <li><a href="#private-browsing"><span class="secno">6.2</span> <span class="content">Private Browsing</span></a>
      <li><a href="#implementation-risks"><span class="secno">6.3</span> <span class="content">Implementation Risks</span></a>
      <li><a href="#security-privacy-checklist"><span class="secno">6.4</span> <span class="content">Checklist</span></a>
     </ol>
    <li><a href="#acknowledgements"><span class="secno">7</span> <span class="content">Acknowledgements</span></a>
    <li><a href="#conformance"><span class="secno"></span> <span class="content"> Conformance</span></a>
    <li>
     <a href="#index"><span class="secno"></span> <span class="content">Index</span></a>
     <ol class="toc">
      <li><a href="#index-defined-here"><span class="secno"></span> <span class="content">Terms defined by this specification</span></a>
      <li><a href="#index-defined-elsewhere"><span class="secno"></span> <span class="content">Terms defined by reference</span></a>
     </ol>
    <li>
     <a href="#references"><span class="secno"></span> <span class="content">References</span></a>
     <ol class="toc">
      <li><a href="#normative"><span class="secno"></span> <span class="content">Normative References</span></a>
      <li><a href="#informative"><span class="secno"></span> <span class="content">Informative References</span></a>
     </ol>
    <li><a href="#idl-index"><span class="secno"></span> <span class="content">IDL Index</span></a>
    <li><a href="#issues-index"><span class="secno"></span> <span class="content">Issues Index</span></a>
   </ol>
  </nav>
  <main>
   <p><img alt="logo" src="logo-lock.svg" style="height: 100px; width: 100px; position: absolute; right: 20px; top: 30px;"></p>
   <h2 class="heading settled" data-level="1" id="introduction"><span class="secno">1. </span><span class="content">Introduction</span><a class="self-link" href="#introduction"></a></h2>
   <p><em>This section is non-normative.</em></p>
   <p>A <a data-link-type="dfn" href="#lock-request" id="ref-for-lock-request">lock request</a> is made by script for a particular <a data-link-type="dfn" href="#resource-name" id="ref-for-resource-name">resource name</a> and <a data-link-type="dfn" href="#mode" id="ref-for-mode">mode</a>. A scheduling algorithm looks at the state of current and previous requests, and eventually grants a lock request. A <a data-link-type="dfn" href="#lock-concept" id="ref-for-lock-concept">lock</a> is a granted request; it has a <a data-link-type="dfn" href="#resource-name" id="ref-for-resource-name①">resource name</a> and <a data-link-type="dfn" href="#mode" id="ref-for-mode①">mode</a>. It is represented as an object returned to script. As long as the lock is held it may prevent other lock requests from being granted (depending on the name and mode). A lock can be released by script, at which point it may allow other lock requests to be granted.</p>
   <p>The API provides optional functionality that may be used as needed, including:</p>
   <ul>
    <li data-md>
     <p>returning values from the asynchronous task,</p>
    <li data-md>
     <p>shared and exclusive lock modes,</p>
    <li data-md>
     <p>conditional acquisition,</p>
    <li data-md>
     <p>diagnostics to query the state of locks in an origin, and</p>
    <li data-md>
     <p>an escape hatch to protect against deadlocks.</p>
   </ul>
   <p>Cooperative coordination takes place within the scope of same-origin <a data-link-type="dfn" href="https://tc39.github.io/ecma262/#agent" id="ref-for-agent">agents</a>; this may span multiple <a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/webappapis.html#integration-with-the-javascript-agent-cluster-formalism" id="ref-for-integration-with-the-javascript-agent-cluster-formalism">agent clusters</a>.</p>
   <aside class="note"> <a data-link-type="dfn" href="https://tc39.github.io/ecma262/#agent" id="ref-for-agent①">Agents</a> roughly correspond to windows (tabs), iframes, and workers. <a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/webappapis.html#integration-with-the-javascript-agent-cluster-formalism" id="ref-for-integration-with-the-javascript-agent-cluster-formalism①">Agent clusters</a> correspond to independent processes in some user agent implementations. </aside>
   <h3 class="heading settled" data-level="1.1" id="usage-overview"><span class="secno">1.1. </span><span class="content">Usage Overview</span><a class="self-link" href="#usage-overview"></a></h3>
   <p>The API is used as follows:</p>
   <ol>
    <li data-md>
     <p>The lock is requested.</p>
    <li data-md>
     <p>Work is done while holding the lock in an asynchronous task.</p>
    <li data-md>
     <p>The lock is automatically released when the task completes.</p>
   </ol>
   <aside class="example" id="example-basic-usage">
    <a class="self-link" href="#example-basic-usage"></a> 
    <p>A basic example of the API usage is as follows:</p>
<pre class="language-js highlight">navigator<c- p>.</c->locks<c- p>.</c->request<c- p>(</c-><c- t>'my_resource'</c-><c- p>,</c-> async lock <c- p>=></c-> <c- p>{</c->
   <c- c1>// The lock has been acquired.</c->
   await do_something<c- p>();</c->
   await do_somethng_else<c- p>();</c->
   <c- c1>// Now the lock will be released.</c->
<c- p>});</c->
</pre>
    <p>Within an asynchronous function, the request itself can be awaited:</p>
<pre class="language-js highlight"><c- c1>// Before requesting the lock.</c->
await navigator<c- p>.</c->locks<c- p>.</c->request<c- p>(</c-><c- t>'my_resource'</c-><c- p>,</c-> async lock <c- p>=></c-> <c- p>{</c->
   <c- c1>// The lock has been acquired.</c->
   await do_something<c- p>();</c->
   <c- c1>// Now the lock will be released.</c->
<c- p>});</c->
<c- c1>// After the lock has been released</c->
</pre>
   </aside>
   <h3 class="heading settled" data-level="1.2" id="motivations"><span class="secno">1.2. </span><span class="content">Motivating Use Cases</span><a class="self-link" href="#motivations"></a></h3>
   <p>A web-based document editor stores state in memory for fast access and persists changes (as a series of records) to a storage API such as the <a data-link-type="biblio" href="#biblio-indexeddb-2">Indexed Database API</a> for resiliency and offline use, and to a server for cross-device use. When the same document is opened for editing in two tabs the work must be coordinated across tabs, such as allowing only one tab to make changes to or synchronize the document at a time. This requires the tabs to coordinate on which will be actively making changes (and synchronizing the in-memory state with the storage API), knowing when the active tab goes away (navigated, closed, crashed) so that another tab can become active.</p>
   <p>In a data synchronization service, a "master tab" is designated. This tab is the only one that should be performing some operations (e.g. network sync, cleaning up queued data, etc). It holds a lock and never releases it. Other tabs can attempt to acquire the lock, and such attempts will be queued. If the "master tab" crashes or is closed then one of the other tabs will get the lock and become the new master.</p>
   <p>The <a data-link-type="biblio" href="#biblio-indexeddb-2">Indexed Database API</a> defines a transaction model allowing shared read and exclusive write access across multiple named storage partitions within an origin. Exposing this concept as a primitive allows any Web Platform activity to be scheduled based on resource availability, for example allowing transactions to be composed for other storage types (such as Caches <a data-link-type="biblio" href="#biblio-service-workers">[Service-Workers]</a>), across storage types, even across non-storage APIs (e.g. network fetches).</p>
   <h2 class="heading settled" data-level="2" id="concepts"><span class="secno">2. </span><span class="content">Concepts</span><a class="self-link" href="#concepts"></a></h2>
   <p>For the purposes of this specification:</p>
   <ul>
    <li data-md>
     <p>Separate user profiles within a browser are considered separate user agents.</p>
    <li data-md>
     <p>Every <a href="https://github.com/w3ctag/private-mode">private mode</a> browsing session is considered a separate user agent.</p>
   </ul>
   <p>A user agent has a <dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport id="lock-task-queue">lock task queue</dfn> which is the result of <a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/infrastructure.html#starting-a-new-parallel-queue" id="ref-for-starting-a-new-parallel-queue">starting a new parallel queue</a>.</p>
   <p>The <a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/webappapis.html#task-source" id="ref-for-task-source">task source</a> for <a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/infrastructure.html#enqueue-the-following-steps" id="ref-for-enqueue-the-following-steps">steps enqueued</a> below is the <dfn data-dfn-type="dfn" data-export id="web-locks-tasks-source">web locks tasks source<a class="self-link" href="#web-locks-tasks-source"></a></dfn>.</p>
   <h3 class="heading settled" data-level="2.1" id="resource-names"><span class="secno">2.1. </span><span class="content">Resources Names</span><a class="self-link" href="#resource-names"></a></h3>
   <p>A <dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport id="resource-name">resource name</dfn> is a <a data-link-type="dfn" href="https://infra.spec.whatwg.org/#javascript-string" id="ref-for-javascript-string">JavaScript string</a> chosen by the web application to represent an abstract resource.</p>
   <p>A resource name has no external meaning beyond the scheduling algorithm, but is global
across <a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/browsers.html#browsing-context" id="ref-for-browsing-context">browsing contexts</a> within an <a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/origin.html#concept-origin" id="ref-for-concept-origin">origin</a>. Web applications are free to use any resource naming scheme.</p>
   <aside class="example" id="example-indexeddb-transactions">
    <a class="self-link" href="#example-indexeddb-transactions"></a> To mimic transaction locking over named stores within a named
database in <a data-link-type="biblio" href="#biblio-indexeddb-2">[IndexedDB-2]</a>, an origin might compose resource names as: 
<pre class="language-js highlight">encodeURIComponent<c- p>(</c->db_name<c- p>)</c-> <c- o>+</c-> <c- t>'/'</c-> <c- o>+</c-> encodeURIComponent<c- p>(</c->store_name<c- p>)</c->
</pre>
   </aside>
   <p>Resource names starting with U+002D HYPHEN-MINUS (-) are reserved; requesting these will cause an exception.</p>
   <h3 class="heading settled" data-level="2.2" id="lock-managers"><span class="secno">2.2. </span><span class="content">Lock Managers</span><a class="self-link" href="#lock-managers"></a></h3>
   <p>A user agent has a <dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport id="lock-manager">lock manager</dfn> for each <a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/origin.html#concept-origin" id="ref-for-concept-origin①">origin</a>, which encapsulates the state of all <a data-link-type="dfn" href="#lock-concept" id="ref-for-lock-concept①">locks</a> and <a data-link-type="dfn" href="#lock-request" id="ref-for-lock-request①">lock requests</a> for that origin.</p>
   <p>Pages and workers (<a data-link-type="dfn" href="https://tc39.github.io/ecma262/#agent" id="ref-for-agent②">agents</a>) on a single <a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/origin.html#concept-origin" id="ref-for-concept-origin②">origin</a> opened in the same user agent share a lock manager even if they are in unrelated <a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/browsers.html#browsing-context" id="ref-for-browsing-context①">browsing contexts</a>.</p>
   <aside class="note">
    <p>There is an equivalence between the following:</p>
    <ul>
     <li data-md>
      <p>Agents that share a <a data-link-type="dfn" href="#lock-manager" id="ref-for-lock-manager">lock manager</a>.</p>
     <li data-md>
      <p>Agents that share a <a data-link-type="dfn" href="https://storage.spec.whatwg.org/#site-storage-unit" id="ref-for-site-storage-unit">site storage unit</a>, i.e. a per-origin <a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/webstorage.html#dom-localstorage" id="ref-for-dom-localstorage">local storage area</a> <a data-link-type="biblio" href="#biblio-html">[HTML]</a>, set of <a href="https://w3c.github.io/IndexedDB/#database-construct">databases</a> <a data-link-type="biblio" href="#biblio-indexeddb-2">[IndexedDB-2]</a>, or <a href="https://www.w3.org/TR/service-workers-1/#cache-objects">caches</a> <a data-link-type="biblio" href="#biblio-service-workers">[Service-Workers]</a>.</p>
    </ul>
   </aside>
   <aside class="issue" id="issue-fb27f9c9"><a class="self-link" href="#issue-fb27f9c9"></a> Migrate this definition to <a data-link-type="biblio" href="#biblio-html">[HTML]</a> or <a data-link-type="biblio" href="#biblio-storage">[Storage]</a> so it can be referenced by other standards. </aside>
   <h3 class="heading settled" data-level="2.3" id="modes-scheduling"><span class="secno">2.3. </span><span class="content">Modes and Scheduling</span><a class="self-link" href="#modes-scheduling"></a></h3>
   <p>A <dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport id="mode">mode</dfn> is either "<code class="idl"><a data-link-type="idl" href="#dom-lockmode-exclusive" id="ref-for-dom-lockmode-exclusive">exclusive</a></code>" or "<code class="idl"><a data-link-type="idl" href="#dom-lockmode-shared" id="ref-for-dom-lockmode-shared">shared</a></code>". Modes can be used to model the common <a href="http://en.wikipedia.org/wiki/Readers%E2%80%93writer_lock">readers-writer lock</a> pattern. If an "<code class="idl"><a data-link-type="idl" href="#dom-lockmode-exclusive" id="ref-for-dom-lockmode-exclusive①">exclusive</a></code>" lock is held, then no other locks with that name can be granted. If a "<code class="idl"><a data-link-type="idl" href="#dom-lockmode-shared" id="ref-for-dom-lockmode-shared①">shared</a></code>" lock is held, other "<code class="idl"><a data-link-type="idl" href="#dom-lockmode-shared" id="ref-for-dom-lockmode-shared②">shared</a></code>" locks with that name can be granted — but not any "<code class="idl"><a data-link-type="idl" href="#dom-lockmode-exclusive" id="ref-for-dom-lockmode-exclusive②">exclusive</a></code>" locks. The default mode in the API is "<code class="idl"><a data-link-type="idl" href="#dom-lockmode-exclusive" id="ref-for-dom-lockmode-exclusive③">exclusive</a></code>".</p>
   <p>Additional properties may influence scheduling, such as timeouts, fairness, and so on.</p>
   <h3 class="heading settled" data-level="2.4" id="concept-lock"><span class="secno">2.4. </span><span class="content">Locks</span><a class="self-link" href="#concept-lock"></a></h3>
   <p>A <dfn class="dfn-paneled" data-dfn-type="dfn" data-lt="lock-concept" data-noexport id="lock-concept">lock</dfn> represents exclusive access to a shared resource.</p>
   <div>
    <p>A <a data-link-type="dfn" href="#lock-concept" id="ref-for-lock-concept②">lock</a> has an <dfn class="dfn-paneled" data-dfn-for="lock-concept" data-dfn-type="dfn" data-noexport id="lock-concept-agent">agent</dfn> which is an <a data-link-type="dfn" href="https://tc39.github.io/ecma262/#agent" id="ref-for-agent③">agent</a>.</p>
    <p>A <a data-link-type="dfn" href="#lock-concept" id="ref-for-lock-concept③">lock</a> has a <dfn class="dfn-paneled" data-dfn-for="lock-concept" data-dfn-type="dfn" data-noexport id="lock-concept-clientid">clientId</dfn> which is an opaque string.</p>
    <p>A <a data-link-type="dfn" href="#lock-concept" id="ref-for-lock-concept④">lock</a> has an <dfn class="dfn-paneled" data-dfn-for="lock-concept" data-dfn-type="dfn" data-noexport id="lock-concept-origin">origin</dfn> which is an <a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/origin.html#concept-origin" id="ref-for-concept-origin③">origin</a>.</p>
    <p>A <a data-link-type="dfn" href="#lock-concept" id="ref-for-lock-concept⑤">lock</a> has a <dfn class="dfn-paneled" data-dfn-for="lock-concept" data-dfn-type="dfn" data-noexport id="lock-concept-name">name</dfn> which is a <a data-link-type="dfn" href="#resource-name" id="ref-for-resource-name②">resource name</a>.</p>
    <p>A <a data-link-type="dfn" href="#lock-concept" id="ref-for-lock-concept⑥">lock</a> has a <dfn class="dfn-paneled" data-dfn-for="lock-concept" data-dfn-type="dfn" data-noexport id="lock-concept-mode">mode</dfn> which is one of "<code class="idl"><a data-link-type="idl" href="#dom-lockmode-exclusive" id="ref-for-dom-lockmode-exclusive④">exclusive</a></code>" or "<code class="idl"><a data-link-type="idl" href="#dom-lockmode-shared" id="ref-for-dom-lockmode-shared③">shared</a></code>".</p>
    <p>A <a data-link-type="dfn" href="#lock-concept" id="ref-for-lock-concept⑦">lock</a> has a <dfn class="dfn-paneled" data-dfn-for="lock-concept" data-dfn-type="dfn" data-noexport id="lock-concept-waiting-promise">waiting promise</dfn> which is a Promise.</p>
    <p>A <a data-link-type="dfn" href="#lock-concept" id="ref-for-lock-concept⑧">lock</a> has a <dfn class="dfn-paneled" data-dfn-for="lock-concept" data-dfn-type="dfn" data-noexport id="lock-concept-released-promise">released promise</dfn> which is a Promise.</p>
    <aside class="note">
      There are two promises associated with a lock’s lifecycle: 
     <ul>
      <li data-md>
       <p>A promise provided either implicitly or explicitly by the callback when the lock is granted which determines how long the lock is held. When this promise settles, the lock is released. This is known as the lock’s <a data-link-type="dfn" href="#lock-concept-waiting-promise" id="ref-for-lock-concept-waiting-promise">waiting promise</a>.</p>
      <li data-md>
       <p>A promise returned by <code class="idl"><a data-link-type="idl" href="#lockmanager" id="ref-for-lockmanager">LockManager</a></code>'s <code class="idl"><a data-link-type="idl" href="#dom-lockmanager-request" id="ref-for-dom-lockmanager-request">request()</a></code> method that settles when the lock is released or the request is aborted. This is known as the lock’s <a data-link-type="dfn" href="#lock-concept-released-promise" id="ref-for-lock-concept-released-promise">released promise</a>.</p>
     </ul>
<pre class="language-js highlight"><c- kr>const</c-> p1 <c- o>=</c-> navigator<c- p>.</c->locks<c- p>.</c->request<c- p>(</c-><c- t>'resource'</c-><c- p>,</c-> lock <c- p>=></c-> <c- p>{</c->
  <c- kr>const</c-> p2 <c- o>=</c-> <c- k>new</c-> Promise<c- p>(</c->r <c- p>=></c-> <c- p>{</c->
    <c- c1>// Logic to use lock and resolve promise...</c->
  <c- p>});</c->
  <c- k>return</c-> p2<c- p>;</c->
<c- p>});</c->
</pre>
     <p>In the above example, <code>p1</code> is the <a data-link-type="dfn" href="#lock-concept-released-promise" id="ref-for-lock-concept-released-promise①">released promise</a> and <code>p2</code> is the <a data-link-type="dfn" href="#lock-concept-waiting-promise" id="ref-for-lock-concept-waiting-promise①">waiting promise</a>.
Note that in most code the callback would be implemented as an <code>async</code> function and the returned promise would be implicit, as in the following example:</p>
<pre class="language-js highlight"><c- kr>const</c-> p1 <c- o>=</c-> navigator<c- p>.</c->locks<c- p>.</c->request<c- p>(</c-><c- t>'resource'</c-><c- p>,</c-> async lock <c- p>=></c-> <c- p>{</c->
  <c- c1>// Logic to use lock...</c->
<c- p>});</c->
</pre>
     <p>The <a data-link-type="dfn" href="#lock-concept-waiting-promise" id="ref-for-lock-concept-waiting-promise②">waiting promise</a> is not named in the above code, but is still present as the return value from the anonymous <code>async</code> callback.
Further note that if the callback is not <code>async</code> and returns a non-promise, the return value is wrapped in a promise that is immediately resolved; the lock will be released in an upcoming microtask, and the <a data-link-type="dfn" href="#lock-concept-released-promise" id="ref-for-lock-concept-released-promise②">released promise</a> will also resolve in a subsequent microtask.</p>
    </aside>
    <p>Each origin has a <dfn class="dfn-paneled" data-dfn-for="lock-concept" data-dfn-type="dfn" data-noexport id="lock-concept-held-lock-set">held lock set</dfn> which is a <a data-link-type="dfn" href="https://infra.spec.whatwg.org/#ordered-set" id="ref-for-ordered-set">set</a> of <a data-link-type="dfn" href="#lock-concept" id="ref-for-lock-concept⑨">locks</a>.</p>
    <p>When <a data-link-type="dfn" href="#lock-concept" id="ref-for-lock-concept①⓪">lock</a> <var>lock</var>’s <a data-link-type="dfn" href="#lock-concept-waiting-promise" id="ref-for-lock-concept-waiting-promise③">waiting promise</a> settles (fulfills or rejects), <a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/infrastructure.html#enqueue-the-following-steps" id="ref-for-enqueue-the-following-steps①">enqueue the following steps</a> on the <a data-link-type="dfn" href="#lock-task-queue" id="ref-for-lock-task-queue">lock task queue</a>:</p>
    <ol>
     <li data-md>
      <p><a data-link-type="dfn" href="#release-the-lock" id="ref-for-release-the-lock">Release the lock</a> <var>lock</var>.</p>
     <li data-md>
      <p><a data-link-type="dfn">Resolve</a> <var>lock</var>’s <a data-link-type="dfn" href="#lock-concept-released-promise" id="ref-for-lock-concept-released-promise③">released promise</a> with <var>lock</var>’s <a data-link-type="dfn" href="#lock-concept-waiting-promise" id="ref-for-lock-concept-waiting-promise④">waiting promise</a>.</p>
    </ol>
   </div>
   <h3 class="heading settled" data-level="2.5" id="concept-lock-request"><span class="secno">2.5. </span><span class="content">Lock Requests</span><a class="self-link" href="#concept-lock-request"></a></h3>
   <p>A <dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport id="lock-request">lock request</dfn> represents a pending request for a <a data-link-type="dfn" href="#lock-concept" id="ref-for-lock-concept①①">lock</a>.</p>
   <div>
    <p>A <a data-link-type="dfn" href="#lock-request" id="ref-for-lock-request②">lock request</a> is a tuple of (<dfn class="dfn-paneled" data-dfn-for="lock request" data-dfn-type="dfn" data-noexport id="lock-request-agent">agent</dfn>, <dfn class="dfn-paneled" data-dfn-for="lock request" data-dfn-type="dfn" data-noexport id="lock-request-clientid">clientId</dfn>, <dfn class="dfn-paneled" data-dfn-for="lock request" data-dfn-type="dfn" data-noexport id="lock-request-origin">origin</dfn>, <dfn class="dfn-paneled" data-dfn-for="lock request" data-dfn-type="dfn" data-noexport id="lock-request-name">name</dfn>, <dfn class="dfn-paneled" data-dfn-for="lock request" data-dfn-type="dfn" data-noexport id="lock-request-mode">mode</dfn>, <dfn class="dfn-paneled" data-dfn-for="lock request" data-dfn-type="dfn" data-noexport id="lock-request-promise">promise</dfn>).</p>
    <p>A <dfn class="dfn-paneled" data-dfn-for="lock request" data-dfn-type="dfn" data-noexport id="lock-request-lock-request-queue">lock request queue</dfn> is a <a data-link-type="dfn" href="https://infra.spec.whatwg.org/#queue" id="ref-for-queue">queue</a> of <a data-link-type="dfn" href="#lock-request" id="ref-for-lock-request③">lock requests</a>.</p>
    <p>Each origin has a <dfn class="dfn-paneled" data-dfn-for="lock request" data-dfn-type="dfn" data-noexport id="lock-request-lock-request-queue-map">lock request queue map</dfn>, which is a <a data-link-type="dfn" href="https://infra.spec.whatwg.org/#ordered-map" id="ref-for-ordered-map">map</a> of <a data-link-type="dfn" href="#resource-name" id="ref-for-resource-name③">resource names</a> to <a data-link-type="dfn" href="#lock-request-lock-request-queue" id="ref-for-lock-request-lock-request-queue">lock request queues</a>.</p>
    <p>A <a data-link-type="dfn" href="#lock-request" id="ref-for-lock-request④">lock request</a> <var>request</var> is said to be <dfn class="dfn-paneled" data-dfn-for="lock request" data-dfn-type="dfn" data-noexport id="lock-request-grantable">grantable</dfn> if the following steps return true:</p>
    <ol>
     <li data-md>
      <p>Let <var>origin</var> be <var>request</var>’s <a data-link-type="dfn" href="#lock-request-origin" id="ref-for-lock-request-origin">origin</a>.</p>
     <li data-md>
      <p>Let <var>queueMap</var> be <var>origin</var>’s <a data-link-type="dfn" href="#lock-request-lock-request-queue-map" id="ref-for-lock-request-lock-request-queue-map">lock request queue map</a>.</p>
     <li data-md>
      <p>Let <var>name</var> be <var>request</var>’s <a data-link-type="dfn" href="#lock-request-name" id="ref-for-lock-request-name">name</a>.</p>
     <li data-md>
      <p>Let <var>queue</var> be <var>queueMap</var>[<var>name</var>].</p>
     <li data-md>
      <p>Let <var>held</var> be <var>origin</var>’s <a data-link-type="dfn" href="#lock-concept-held-lock-set" id="ref-for-lock-concept-held-lock-set">held lock set</a></p>
     <li data-md>
      <p>Let <var>mode</var> be <var>request</var>’s <a data-link-type="dfn" href="#lock-request-mode" id="ref-for-lock-request-mode">mode</a></p>
     <li data-md>
      <p>If <var>mode</var> is "<code class="idl"><a data-link-type="idl" href="#dom-lockmode-exclusive" id="ref-for-dom-lockmode-exclusive⑤">exclusive</a></code>", then return true if all of the following conditions are true, and false otherwise:</p>
      <ul>
       <li data-md>
        <p>No <a data-link-type="dfn" href="#lock-concept" id="ref-for-lock-concept①②">lock</a> in <var>held</var> has a <a data-link-type="dfn" href="#lock-concept-name" id="ref-for-lock-concept-name">name</a> that equals <var>name</var></p>
       <li data-md>
        <p>No <a data-link-type="dfn" href="#lock-request" id="ref-for-lock-request⑤">lock request</a> in <var>queue</var> earlier than <var>request</var> exists.</p>
      </ul>
     <li data-md>
      <p>Otherwise, mode is "<code class="idl"><a data-link-type="idl" href="#dom-lockmode-shared" id="ref-for-dom-lockmode-shared④">shared</a></code>"; return true if all of the following conditions are true, and false otherwise:</p>
      <ul>
       <li data-md>
        <p>No <a data-link-type="dfn" href="#lock-concept" id="ref-for-lock-concept①③">lock</a> in <var>held</var> has <a data-link-type="dfn" href="#lock-concept-mode" id="ref-for-lock-concept-mode">mode</a> "<code class="idl"><a data-link-type="idl" href="#dom-lockmode-exclusive" id="ref-for-dom-lockmode-exclusive⑥">exclusive</a></code>" and has a <a data-link-type="dfn" href="#lock-concept-name" id="ref-for-lock-concept-name①">name</a> that equals <var>name</var>.</p>
       <li data-md>
        <p>No <a data-link-type="dfn" href="#lock-request" id="ref-for-lock-request⑥">lock request</a> in <var>queue</var> earlier than <var>request</var> exists.</p>
      </ul>
    </ol>
   </div>
   <h3 class="heading settled" data-level="2.6" id="agent-integration"><span class="secno">2.6. </span><span class="content">Agent Integration</span><a class="self-link" href="#agent-integration"></a></h3>
   <div class="algorithm">
     When an <a data-link-type="dfn" href="https://tc39.github.io/ecma262/#agent" id="ref-for-agent④">agent</a> terminates, <a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/infrastructure.html#enqueue-the-following-steps" id="ref-for-enqueue-the-following-steps②">enqueue the following steps</a> on the <a data-link-type="dfn" href="#lock-task-queue" id="ref-for-lock-task-queue①">lock task queue</a>: 
    <aside class="issue" id="issue-9d75c9d8"><a class="self-link" href="#issue-9d75c9d8"></a> Normative reference for <i>terminates</i>. </aside>
    <ol>
     <li data-md>
      <p>For each <a data-link-type="dfn" href="#lock-request" id="ref-for-lock-request⑦">lock request</a> <var>request</var> with <a data-link-type="dfn" href="#lock-request-agent" id="ref-for-lock-request-agent">agent</a> equal to the terminating agent:</p>
      <ol>
       <li data-md>
        <p><a data-link-type="dfn" href="#abort-the-request" id="ref-for-abort-the-request">Abort the request</a> <var>request</var>.</p>
      </ol>
     <li data-md>
      <p>For each <a data-link-type="dfn" href="#lock-concept" id="ref-for-lock-concept①④">lock</a> <var>lock</var> with <a data-link-type="dfn" href="#lock-concept-agent" id="ref-for-lock-concept-agent">agent</a> equal to the terminating agent:</p>
      <ol>
       <li data-md>
        <p><a data-link-type="dfn" href="#release-the-lock" id="ref-for-release-the-lock①">Release the lock</a> <var>lock</var>.</p>
      </ol>
    </ol>
   </div>
   <h2 class="heading settled" data-level="3" id="api"><span class="secno">3. </span><span class="content">API</span><a class="self-link" href="#api"></a></h2>
   <h3 class="heading settled" data-level="3.1" id="navigator-mixins"><span class="secno">3.1. </span><span class="content">Navigator Mixins</span><a class="self-link" href="#navigator-mixins"></a></h3>
<pre class="idl highlight def">[<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#SecureContext" id="ref-for-SecureContext"><c- g>SecureContext</c-></a>]
<c- b>interface</c-> <c- b>mixin</c-> <dfn class="dfn-paneled idl-code" data-dfn-type="interface" data-export id="navigatorlocks"><code><c- g>NavigatorLocks</c-></code></dfn> {
  <c- b>readonly</c-> <c- b>attribute</c-> <a class="n" data-link-type="idl-name" href="#lockmanager" id="ref-for-lockmanager①"><c- n>LockManager</c-></a> <dfn class="dfn-paneled idl-code" data-dfn-for="NavigatorLocks" data-dfn-type="attribute" data-export data-readonly data-type="LockManager" id="dom-navigatorlocks-locks"><code><c- g>locks</c-></code></dfn>;
};
<a class="n" data-link-type="idl-name" href="https://html.spec.whatwg.org/multipage/system-state.html#navigator" id="ref-for-navigator"><c- n>Navigator</c-></a> <c- b>includes</c-> <a class="n" data-link-type="idl-name" href="#navigatorlocks" id="ref-for-navigatorlocks"><c- n>NavigatorLocks</c-></a>;
<a class="n" data-link-type="idl-name" href="https://html.spec.whatwg.org/multipage/workers.html#workernavigator" id="ref-for-workernavigator"><c- n>WorkerNavigator</c-></a> <c- b>includes</c-> <a class="n" data-link-type="idl-name" href="#navigatorlocks" id="ref-for-navigatorlocks①"><c- n>NavigatorLocks</c-></a>;
</pre>
   <p>Each <a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/webappapis.html#environment-settings-object" id="ref-for-environment-settings-object">environment settings object</a> has a <code class="idl"><a data-link-type="idl" href="#lockmanager" id="ref-for-lockmanager②">LockManager</a></code> object.</p>
   <p>The <code class="idl"><a data-link-type="idl" href="#dom-navigatorlocks-locks" id="ref-for-dom-navigatorlocks-locks">locks</a></code> attribute’s getter must return the <a data-link-type="dfn" href="https://dom.spec.whatwg.org/#context-object" id="ref-for-context-object">context object</a>'s <a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/webappapis.html#relevant-settings-object" id="ref-for-relevant-settings-object">relevant settings object</a>'s <code class="idl"><a data-link-type="idl" href="#lockmanager" id="ref-for-lockmanager③">LockManager</a></code> object.</p>
   <h3 class="heading settled" data-level="3.2" id="api-lock-manager"><span class="secno">3.2. </span><span class="content"><code class="idl"><a data-link-type="idl" href="#lockmanager" id="ref-for-lockmanager④">LockManager</a></code> class</span><a class="self-link" href="#api-lock-manager"></a></h3>
<pre class="idl highlight def">[<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#SecureContext" id="ref-for-SecureContext①"><c- g>SecureContext</c-></a>, <a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#Exposed" id="ref-for-Exposed"><c- g>Exposed</c-></a>=(<c- n>Window</c->,<c- n>Worker</c->)]
<c- b>interface</c-> <dfn class="dfn-paneled idl-code" data-dfn-type="interface" data-export id="lockmanager"><code><c- g>LockManager</c-></code></dfn> {
  <c- b>Promise</c->&lt;<c- b>any</c->> <a class="idl-code" data-link-type="method" href="#dom-lockmanager-request" id="ref-for-dom-lockmanager-request①"><c- g>request</c-></a>(<a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-DOMString" id="ref-for-idl-DOMString"><c- b>DOMString</c-></a> <dfn class="idl-code" data-dfn-for="LockManager/request(name, callback)" data-dfn-type="argument" data-export id="dom-lockmanager-request-name-callback-name"><code><c- g>name</c-></code><a class="self-link" href="#dom-lockmanager-request-name-callback-name"></a></dfn>,
                       <a class="n" data-link-type="idl-name" href="#callbackdef-lockgrantedcallback" id="ref-for-callbackdef-lockgrantedcallback"><c- n>LockGrantedCallback</c-></a> <dfn class="idl-code" data-dfn-for="LockManager/request(name, callback)" data-dfn-type="argument" data-export id="dom-lockmanager-request-name-callback-callback"><code><c- g>callback</c-></code><a class="self-link" href="#dom-lockmanager-request-name-callback-callback"></a></dfn>);
  <c- b>Promise</c->&lt;<c- b>any</c->> <a class="idl-code" data-link-type="method" href="#dom-lockmanager-request-name-options-callback" id="ref-for-dom-lockmanager-request-name-options-callback"><c- g>request</c-></a>(<a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-DOMString" id="ref-for-idl-DOMString①"><c- b>DOMString</c-></a> <dfn class="idl-code" data-dfn-for="LockManager/request(name, options, callback)" data-dfn-type="argument" data-export id="dom-lockmanager-request-name-options-callback-name"><code><c- g>name</c-></code><a class="self-link" href="#dom-lockmanager-request-name-options-callback-name"></a></dfn>,
                       <a class="n" data-link-type="idl-name" href="#dictdef-lockoptions" id="ref-for-dictdef-lockoptions"><c- n>LockOptions</c-></a> <dfn class="idl-code" data-dfn-for="LockManager/request(name, options, callback)" data-dfn-type="argument" data-export id="dom-lockmanager-request-name-options-callback-options"><code><c- g>options</c-></code><a class="self-link" href="#dom-lockmanager-request-name-options-callback-options"></a></dfn>,
                       <a class="n" data-link-type="idl-name" href="#callbackdef-lockgrantedcallback" id="ref-for-callbackdef-lockgrantedcallback①"><c- n>LockGrantedCallback</c-></a> <dfn class="idl-code" data-dfn-for="LockManager/request(name, options, callback)" data-dfn-type="argument" data-export id="dom-lockmanager-request-name-options-callback-callback"><code><c- g>callback</c-></code><a class="self-link" href="#dom-lockmanager-request-name-options-callback-callback"></a></dfn>);

  <c- b>Promise</c->&lt;<a class="n" data-link-type="idl-name" href="#dictdef-lockmanagersnapshot" id="ref-for-dictdef-lockmanagersnapshot"><c- n>LockManagerSnapshot</c-></a>> <a class="idl-code" data-link-type="method" href="#dom-lockmanager-query" id="ref-for-dom-lockmanager-query"><c- g>query</c-></a>();
};

<c- b>callback</c-> <dfn class="dfn-paneled idl-code" data-dfn-type="callback" data-export id="callbackdef-lockgrantedcallback"><code><c- g>LockGrantedCallback</c-></code></dfn> = <c- b>Promise</c->&lt;<c- b>any</c->> (<a class="n" data-link-type="idl-name" href="#lock" id="ref-for-lock"><c- n>Lock</c-></a>? <dfn class="idl-code" data-dfn-for="LockGrantedCallback" data-dfn-type="argument" data-export id="dom-lockgrantedcallback-lock"><code><c- g>lock</c-></code><a class="self-link" href="#dom-lockgrantedcallback-lock"></a></dfn>);

<c- b>enum</c-> <dfn class="dfn-paneled idl-code" data-dfn-type="enum" data-export id="enumdef-lockmode"><code><c- g>LockMode</c-></code></dfn> { <dfn class="dfn-paneled idl-code" data-dfn-for="LockMode" data-dfn-type="enum-value" data-export id="dom-lockmode-shared"><code><c- s>"shared"</c-></code></dfn>, <dfn class="dfn-paneled idl-code" data-dfn-for="LockMode" data-dfn-type="enum-value" data-export id="dom-lockmode-exclusive"><code><c- s>"exclusive"</c-></code></dfn> };

<c- b>dictionary</c-> <dfn class="dfn-paneled idl-code" data-dfn-type="dictionary" data-export id="dictdef-lockoptions"><code><c- g>LockOptions</c-></code></dfn> {
  <a class="n" data-link-type="idl-name" href="#enumdef-lockmode" id="ref-for-enumdef-lockmode"><c- n>LockMode</c-></a> <dfn class="dfn-paneled idl-code" data-default="&quot;exclusive&quot;" data-dfn-for="LockOptions" data-dfn-type="dict-member" data-export data-type="LockMode " id="dom-lockoptions-mode"><code><c- g>mode</c-></code></dfn> = "exclusive";
  <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-boolean" id="ref-for-idl-boolean"><c- b>boolean</c-></a> <dfn class="dfn-paneled idl-code" data-default="false" data-dfn-for="LockOptions" data-dfn-type="dict-member" data-export data-type="boolean " id="dom-lockoptions-ifavailable"><code><c- g>ifAvailable</c-></code></dfn> = <c- b>false</c->;
  <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-boolean" id="ref-for-idl-boolean①"><c- b>boolean</c-></a> <dfn class="dfn-paneled idl-code" data-default="false" data-dfn-for="LockOptions" data-dfn-type="dict-member" data-export data-type="boolean " id="dom-lockoptions-steal"><code><c- g>steal</c-></code></dfn> = <c- b>false</c->;
  <a class="n" data-link-type="idl-name" href="https://dom.spec.whatwg.org/#abortsignal" id="ref-for-abortsignal"><c- n>AbortSignal</c-></a> <dfn class="dfn-paneled idl-code" data-dfn-for="LockOptions" data-dfn-type="dict-member" data-export data-type="AbortSignal " id="dom-lockoptions-signal"><code><c- g>signal</c-></code></dfn>;
};

<c- b>dictionary</c-> <dfn class="dfn-paneled idl-code" data-dfn-type="dictionary" data-export id="dictdef-lockmanagersnapshot"><code><c- g>LockManagerSnapshot</c-></code></dfn> {
  <c- b>sequence</c->&lt;<a class="n" data-link-type="idl-name" href="#dictdef-lockinfo" id="ref-for-dictdef-lockinfo"><c- n>LockInfo</c-></a>> <dfn class="idl-code" data-dfn-for="LockManagerSnapshot" data-dfn-type="dict-member" data-export data-type="sequence<LockInfo> " id="dom-lockmanagersnapshot-held"><code><c- g>held</c-></code><a class="self-link" href="#dom-lockmanagersnapshot-held"></a></dfn>;
  <c- b>sequence</c->&lt;<a class="n" data-link-type="idl-name" href="#dictdef-lockinfo" id="ref-for-dictdef-lockinfo①"><c- n>LockInfo</c-></a>> <dfn class="idl-code" data-dfn-for="LockManagerSnapshot" data-dfn-type="dict-member" data-export data-type="sequence<LockInfo> " id="dom-lockmanagersnapshot-pending"><code><c- g>pending</c-></code><a class="self-link" href="#dom-lockmanagersnapshot-pending"></a></dfn>;
};

<c- b>dictionary</c-> <dfn class="dfn-paneled idl-code" data-dfn-type="dictionary" data-export id="dictdef-lockinfo"><code><c- g>LockInfo</c-></code></dfn> {
  <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-DOMString" id="ref-for-idl-DOMString②"><c- b>DOMString</c-></a> <dfn class="idl-code" data-dfn-for="LockInfo" data-dfn-type="dict-member" data-export data-type="DOMString " id="dom-lockinfo-name"><code><c- g>name</c-></code><a class="self-link" href="#dom-lockinfo-name"></a></dfn>;
  <a class="n" data-link-type="idl-name" href="#enumdef-lockmode" id="ref-for-enumdef-lockmode①"><c- n>LockMode</c-></a> <dfn class="idl-code" data-dfn-for="LockInfo" data-dfn-type="dict-member" data-export data-type="LockMode " id="dom-lockinfo-mode"><code><c- g>mode</c-></code><a class="self-link" href="#dom-lockinfo-mode"></a></dfn>;
  <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-DOMString" id="ref-for-idl-DOMString③"><c- b>DOMString</c-></a> <dfn class="idl-code" data-dfn-for="LockInfo" data-dfn-type="dict-member" data-export data-type="DOMString " id="dom-lockinfo-clientid"><code><c- g>clientId</c-></code><a class="self-link" href="#dom-lockinfo-clientid"></a></dfn>;
};
</pre>
   <p>A <code class="idl"><a data-link-type="idl" href="#lockmanager" id="ref-for-lockmanager⑤">LockManager</a></code> instance allows script to make <a data-link-type="dfn" href="#lock-request" id="ref-for-lock-request⑧">lock requests</a> and query
the state of the origin’s <a data-link-type="dfn" href="#lock-manager" id="ref-for-lock-manager①">lock manager</a>.</p>
   <h4 class="heading settled" data-level="3.2.1" id="api-lock-manager-request"><span class="secno">3.2.1. </span><span class="content">The <code class="idl"><a data-link-type="idl" href="#dom-lockmanager-request" id="ref-for-dom-lockmanager-request②">request()</a></code> method</span><a class="self-link" href="#api-lock-manager-request"></a></h4>
   <div class="note" role="note">
    <dl class="domintro">
     <dt><var>promise</var> = navigator . locks . <code class="idl"><a data-link-type="idl" href="#dom-lockmanager-request" id="ref-for-dom-lockmanager-request③">request</a></code>(<var>name</var>, <var>callback</var>)
     <dt><var>promise</var> = navigator . locks . <code class="idl"><a data-link-type="idl" href="#dom-lockmanager-request-name-options-callback" id="ref-for-dom-lockmanager-request-name-options-callback①">request</a></code>(<var>name</var>, <var>options</var>, <var>callback</var>)
     <dd>
      <p>The <code class="idl"><a data-link-type="idl" href="#dom-lockmanager-request" id="ref-for-dom-lockmanager-request④">request()</a></code> method is called to request a lock.</p>
      <p>The <var>name</var> (initial argument) is a <a data-link-type="dfn" href="#resource-name" id="ref-for-resource-name④">resource name</a> string.</p>
      <p>The <var>callback</var> (final argument) is a <a data-link-type="dfn" href="https://heycam.github.io/webidl/#dfn-callback-function" id="ref-for-dfn-callback-function">callback function</a> invoked with the <code class="idl"><a data-link-type="idl" href="#lock" id="ref-for-lock①">Lock</a></code> when granted. This is specified by script, and is usually an <code>async</code> function. The lock is held until the callback function completes. If a non-async callback function is passed in, then it is automatically wrapped in a promise that resolves immediately, so the lock is only held for the duration of the synchronous callback.</p>
      <p>The returned <var>promise</var> resolves (or rejects) with the result of the callback after the lock is released, or rejects if the request is aborted.</p>
      <p>Example:</p>
<pre class="language-js highlight"><c- k>try</c-> <c- p>{</c->
  <c- kr>const</c-> result <c- o>=</c-> await navigator<c- p>.</c->locks<c- p>.</c->request<c- p>(</c-><c- t>'resource'</c-><c- p>,</c-> async lock <c- p>=></c-> <c- p>{</c->
    <c- c1>// The lock is held here.</c->
    await do_something<c- p>();</c->
    await do_something_else<c- p>();</c->
    <c- k>return</c-> <c- u>"ok"</c-><c- p>;</c->
    <c- c1>// The lock will be released now.</c->
  <c- p>});</c->
  <c- c1>// |result| has the return value of the callback.</c->
<c- p>}</c-> <c- k>catch</c-> <c- p>(</c->ex<c- p>)</c-> <c- p>{</c->
  <c- c1>// if the callback threw, it will be caught here.</c->
<c- p>}</c->
</pre>
      <p>The lock will be released when the callback exits for any reason — either when the code returns, or if it throws.</p>
      <p>An <var>options</var> dictionary can be specified as a second argument; the <var>callback</var> argument is always last.</p>
     <dt><var>options</var> . mode
     <dd>
      <p>The <code class="idl"><a data-link-type="idl" href="#dom-lockoptions-mode" id="ref-for-dom-lockoptions-mode">mode</a></code> option can be "<code class="idl"><a data-link-type="idl" href="#dom-lockmode-exclusive" id="ref-for-dom-lockmode-exclusive⑦">exclusive</a></code>" (the default if not specified) or "<code class="idl"><a data-link-type="idl" href="#dom-lockmode-shared" id="ref-for-dom-lockmode-shared⑤">shared</a></code>".
    Multiple tabs/workers can hold a lock for the same resource in "<code class="idl"><a data-link-type="idl" href="#dom-lockmode-shared" id="ref-for-dom-lockmode-shared⑥">shared</a></code>" mode, but only one tab/worker can hold a lock for the resource in "<code class="idl"><a data-link-type="idl" href="#dom-lockmode-exclusive" id="ref-for-dom-lockmode-exclusive⑧">exclusive</a></code>" mode.</p>
      <p>The most common use for this is to allow multiple readers to access a resource simultaneously but prevent changes.
    Once reader locks are released a single exclusive writer can acquire the lock to make changes, followed by another exclusive writer or more shared readers.</p>
<pre class="language-js highlight">await navigator<c- p>.</c->locks<c- p>.</c->request<c- p>(</c-><c- t>'resource'</c-><c- p>,</c-> <c- p>{</c->mode<c- o>:</c-> <c- t>'shared'</c-><c- p>},</c-> async lock <c- p>=></c-> <c- p>{</c->
  <c- c1>// Lock is held here. Other contexts might also hold the lock in shared mode,</c->
  <c- c1>// but no other contexts will hold the lock in exclusive mode.</c->
<c- p>});</c->
</pre>
     <dt><var>options</var> . ifAvailable
     <dd>
      <p>If the <code class="idl"><a data-link-type="idl" href="#dom-lockoptions-ifavailable" id="ref-for-dom-lockoptions-ifavailable">ifAvailable</a></code> option is <code>true</code>, then the lock is only granted if it can be without additional waiting. Note that this is still not <em>synchronous</em>; in many user agents this will require cross-process communication to see if the lock can be granted. If the lock cannot be granted, the callback is invoked with <code>null</code>. (Since this is expected, the request is <em>not</em> rejected.)</p>
<pre class="language-js highlight">await navigator<c- p>.</c->locks<c- p>.</c->request<c- p>(</c-><c- t>'resource'</c-><c- p>,</c-> <c- p>{</c->ifAvailable<c- o>:</c-> <c- kc>true</c-><c- p>},</c-> async lock <c- p>=></c-> <c- p>{</c->
  <c- k>if</c-> <c- p>(</c-><c- o>!</c->lock<c- p>)</c-> <c- p>{</c->
    <c- c1>// Didn’t get it. Maybe take appropriate action.</c->
    <c- k>return</c-><c- p>;</c->
  <c- p>}</c->
  <c- c1>// Lock is held here.</c->
<c- p>});</c->
</pre>
     <dt><var>options</var> . signal
     <dd>
      <p>The <code class="idl"><a data-link-type="idl" href="#dom-lockoptions-signal" id="ref-for-dom-lockoptions-signal">signal</a></code> option can be set to an <code class="idl"><a data-link-type="idl" href="https://dom.spec.whatwg.org/#abortsignal" id="ref-for-abortsignal①">AbortSignal</a></code>. This allows aborting a lock request, for example if the request is not granted in a timely manner:</p>
<pre class="language-js highlight"><c- kr>const</c-> controller <c- o>=</c-> <c- k>new</c-> AbortController<c- p>();</c->
setTimeout<c- p>(()</c-> <c- p>=></c-> controller<c- p>.</c->abort<c- p>(),</c-> <c- mi>200</c-><c- p>);</c-> <c- c1>// Wait at most 200ms.</c->

<c- k>try</c-> <c- p>{</c->
  await navigator<c- p>.</c->locks<c- p>.</c->request<c- p>(</c->
    <c- t>'resource'</c-><c- p>,</c-> <c- p>{</c->signal<c- o>:</c-> controller<c- p>.</c->signal<c- p>},</c-> async lock <c- p>=></c-> <c- p>{</c->
      <c- c1>// Lock is held here.</c->
  <c- p>});</c->
  <c- c1>// Done with lock here.</c->
<c- p>}</c-> <c- k>catch</c-> <c- p>(</c->ex<c- p>)</c-> <c- p>{</c->
  <c- c1>// |ex| will be a DOMException with error name "AbortError" if timer fired.</c->
<c- p>}</c->
</pre>
      <p>If an abort is signalled before the lock is granted, then the request promise will reject with an <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#aborterror" id="ref-for-aborterror">AbortError</a></code>.
    Once the lock has been granted, the signal is ignored.</p>
     <dt><var>options</var> . steal
     <dd>
       If the <code class="idl"><a data-link-type="idl" href="#dom-lockoptions-steal" id="ref-for-dom-lockoptions-steal">steal</a></code> option is <code>true</code>, then any held locks for the resource will be released (and the <a data-link-type="dfn" href="#lock-concept-released-promise" id="ref-for-lock-concept-released-promise④">released promise</a> of such locks will resolve with <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#aborterror" id="ref-for-aborterror①">AbortError</a></code>), and the request will be granted, preempting any queued requests for it. 
      <p>If a web application detects an unrecoverable state — for example, some coordination point like a Service Worker determines that a tab holding a lock is no longer responding — then it can "steal" a lock using this option.</p>
    </dl>
   </div>
   <aside class="advisement"> Use the <code class="idl"><a data-link-type="idl" href="#dom-lockoptions-steal" id="ref-for-dom-lockoptions-steal①">steal</a></code> option with caution.
    When used, code previously holding a lock will now be executing without guarantees that it is the sole context with access to the resource.
    Similarly, the code that used the option has no guarantees that other contexts will not still be executing as if they have access to the abstract resource.
    It is intended for use by web applications that need to attempt recovery in the face of application and/or user-agent defects, where behavior is already unpredictable. </aside>
   <div class="algorithm">
    <p>The <dfn class="dfn-paneled idl-code" data-dfn-for="LockManager" data-dfn-type="method" data-export id="dom-lockmanager-request"><code>request(<var>name</var>, <var>callback</var>)</code></dfn> and <dfn class="dfn-paneled idl-code" data-dfn-for="LockManager" data-dfn-type="method" data-export id="dom-lockmanager-request-name-options-callback"><code>request(<var>name</var>, <var>options</var>, <var>callback</var>)</code></dfn> methods, when invoked, must run these steps:</p>
    <ol>
     <li data-md>
      <p>If <var>options</var> was not passed, then let <var>options</var> be a new <code class="idl"><a data-link-type="idl" href="#dictdef-lockoptions" id="ref-for-dictdef-lockoptions①">LockOptions</a></code> dictionary with default members.</p>
     <li data-md>
      <p>Let <var>environment</var> be <a data-link-type="dfn" href="https://dom.spec.whatwg.org/#context-object" id="ref-for-context-object①">context object</a>'s <a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/webappapis.html#relevant-settings-object" id="ref-for-relevant-settings-object①">relevant settings object</a>.</p>
     <li data-md>
      <p>Let <var>origin</var> be <var>environment</var>’s <a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/origin.html#concept-origin" id="ref-for-concept-origin④">origin</a>.</p>
     <li data-md>
      <p>If <var>origin</var> is an <a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/origin.html#concept-origin-opaque" id="ref-for-concept-origin-opaque">opaque origin</a>, then return <a data-link-type="dfn" href="https://www.w3.org/2001/tag/doc/promises-guide/#a-promise-rejected-with" id="ref-for-a-promise-rejected-with">a promise rejected with</a> a "<code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#securityerror" id="ref-for-securityerror">SecurityError</a></code>" <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-DOMException" id="ref-for-idl-DOMException">DOMException</a></code>.</p>
     <li data-md>
      <p>If <var>name</var> starts with U+002D HYPHEN-MINUS (-), then return <a data-link-type="dfn" href="https://www.w3.org/2001/tag/doc/promises-guide/#a-promise-rejected-with" id="ref-for-a-promise-rejected-with①">a promise rejected with</a> a "<code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#notsupportederror" id="ref-for-notsupportederror">NotSupportedError</a></code>" <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-DOMException" id="ref-for-idl-DOMException①">DOMException</a></code>.</p>
     <li data-md>
      <p>If both <var>options</var>’ <var>steal</var> dictionary member and <var>options</var>’ <var>ifAvailable</var> dictionary member are true, then return <a data-link-type="dfn" href="https://www.w3.org/2001/tag/doc/promises-guide/#a-promise-rejected-with" id="ref-for-a-promise-rejected-with②">a promise rejected with</a> a "<code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#notsupportederror" id="ref-for-notsupportederror①">NotSupportedError</a></code>" <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-DOMException" id="ref-for-idl-DOMException②">DOMException</a></code>.</p>
     <li data-md>
      <p>If <var>options</var>’ <var>steal</var> dictionary member is true and <var>options</var>’ <var>mode</var> dictionary member is not "<code class="idl"><a data-link-type="idl" href="#dom-lockmode-exclusive" id="ref-for-dom-lockmode-exclusive⑨">exclusive</a></code>", then return <a data-link-type="dfn" href="https://www.w3.org/2001/tag/doc/promises-guide/#a-promise-rejected-with" id="ref-for-a-promise-rejected-with③">a promise rejected with</a> a "<code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#notsupportederror" id="ref-for-notsupportederror②">NotSupportedError</a></code>" <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-DOMException" id="ref-for-idl-DOMException③">DOMException</a></code>.</p>
     <li data-md>
      <p>If <var>options</var>’ <var>signal</var> dictionary member is present, and either of <var>options</var>’ <var>steal</var> dictionary member or <var>options</var>’ <var>ifAvailable</var> dictionary member is true, then return <a data-link-type="dfn" href="https://www.w3.org/2001/tag/doc/promises-guide/#a-promise-rejected-with" id="ref-for-a-promise-rejected-with④">a promise rejected with</a> a "<code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#notsupportederror" id="ref-for-notsupportederror③">NotSupportedError</a></code>" <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-DOMException" id="ref-for-idl-DOMException④">DOMException</a></code>.</p>
     <li data-md>
      <p>If <var>options</var>’ <var>signal</var> dictionary member is present and its <a data-link-type="dfn" href="https://dom.spec.whatwg.org/#abortsignal-aborted-flag" id="ref-for-abortsignal-aborted-flag">aborted flag</a> is set, then return <a data-link-type="dfn" href="https://www.w3.org/2001/tag/doc/promises-guide/#a-promise-rejected-with" id="ref-for-a-promise-rejected-with⑤">a promise rejected with</a> an "<code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#aborterror" id="ref-for-aborterror②">AbortError</a></code>" {{DOMException}.</p>
     <li data-md>
      <p>Let <var>promise</var> be <a data-link-type="dfn" href="https://www.w3.org/2001/tag/doc/promises-guide/#a-new-promise" id="ref-for-a-new-promise">a new promise</a>.</p>
     <li data-md>
      <p>Let <var>request</var> be the result of running the steps to <a data-link-type="dfn" href="#request-a-lock" id="ref-for-request-a-lock">request a lock</a> with <var>promise</var>, the current <a data-link-type="dfn" href="https://tc39.github.io/ecma262/#agent" id="ref-for-agent⑤">agent</a>, <var>environment</var>’s <a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/webappapis.html#concept-environment-id" id="ref-for-concept-environment-id">id</a>, <var>origin</var>, <var>callback</var>, <var>name</var>, <var>options</var>’ <var>mode</var> dictionary member, <var>options</var>’ <var>ifAvailable</var> dictionary member, and <var>options</var>’ <var>steal</var> dictionary member.</p>
     <li data-md>
      <p>If <var>options</var>’ <var>signal</var> dictionary member is present, then <a data-link-type="dfn" href="https://dom.spec.whatwg.org/#abortsignal-add" id="ref-for-abortsignal-add">add the following abort steps</a> to <var>options</var>’ <var>signal</var> dictionary member:</p>
      <ol>
       <li data-md>
        <p><a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/infrastructure.html#enqueue-the-following-steps" id="ref-for-enqueue-the-following-steps③">Enqueue the steps</a> to <a data-link-type="dfn" href="#abort-the-request" id="ref-for-abort-the-request①">abort the request</a> <var>request</var> to the <a data-link-type="dfn" href="#lock-task-queue" id="ref-for-lock-task-queue②">lock task queue</a>.</p>
       <li data-md>
        <p><a data-link-type="dfn" href="https://www.w3.org/2001/tag/doc/promises-guide/#reject-promise" id="ref-for-reject-promise">Reject</a> <var>promise</var> with an "<code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#aborterror" id="ref-for-aborterror③">AbortError</a></code>" <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-DOMException" id="ref-for-idl-DOMException⑤">DOMException</a></code>.</p>
      </ol>
     <li data-md>
      <p>Return <var>promise</var>.</p>
    </ol>
   </div>
   <h4 class="heading settled" data-level="3.2.2" id="api-lock-manager-query"><span class="secno">3.2.2. </span><span class="content">The <code class="idl"><a data-link-type="idl" href="#dom-lockmanager-query" id="ref-for-dom-lockmanager-query①">query()</a></code> method</span><a class="self-link" href="#api-lock-manager-query"></a></h4>
   <div class="note" role="note">
    <dl class="domintro">
     <dt><var>state</var> = await navigator . locks . <code class="idl"><a data-link-type="idl" href="#dom-lockmanager-query" id="ref-for-dom-lockmanager-query②">query</a></code>()
     <dd>
      <p>The <code class="idl"><a data-link-type="idl" href="#dom-lockmanager-query" id="ref-for-dom-lockmanager-query③">query()</a></code> method can be used to produce a snapshot of the <a data-link-type="dfn" href="#lock-manager" id="ref-for-lock-manager②">lock manager</a> state for an origin, which allows a web application to introspect its usage of locks, for logging or debugging purposes.</p>
      <p>The returned promise resolves to <var>state</var>, a plain-old-data structure (i.e. JSON-like data) with this form:</p>
<pre class="language-js highlight"><c- p>{</c->
  held<c- o>:</c-> <c- p>[</c->
    <c- p>{</c-> name<c- o>:</c-> <c- u>"resource1"</c-><c- p>,</c-> mode<c- o>:</c-> <c- u>"exclusive"</c-><c- p>,</c->
      clientId<c- o>:</c-> <c- u>"8b1e730c-7405-47db-9265-6ee7c73ac153"</c-> <c- p>},</c->
    <c- p>{</c-> name<c- o>:</c-> <c- u>"resource2"</c-><c- p>,</c-> mode<c- o>:</c-> <c- u>"shared"</c-><c- p>,</c->
      clientId<c- o>:</c-> <c- u>"8b1e730c-7405-47db-9265-6ee7c73ac153"</c-> <c- p>},</c->
    <c- p>{</c-> name<c- o>:</c-> <c- u>"resource2"</c-><c- p>,</c-> mode<c- o>:</c-> <c- u>"shared"</c-><c- p>,</c->
      clientId<c- o>:</c-> <c- u>"fad203a5-1f31-472b-a7f7-a3236a1f6d3b"</c-> <c- p>},</c->
  <c- p>],</c->
  pending<c- o>:</c-> <c- p>[</c->
    <c- p>{</c-> name<c- o>:</c-> <c- u>"resource1"</c-><c- p>,</c-> mode<c- o>:</c-> <c- u>"exclusive"</c-><c- p>,</c->
      clientId<c- o>:</c-> <c- u>"fad203a5-1f31-472b-a7f7-a3236a1f6d3b"</c-> <c- p>},</c->
    <c- p>{</c-> name<c- o>:</c-> <c- u>"resource1"</c-><c- p>,</c-> mode<c- o>:</c-> <c- u>"exclusive"</c-><c- p>,</c->
      clientId<c- o>:</c-> <c- u>"d341a5d0-1d8d-4224-be10-704d1ef92a15"</c-> <c- p>},</c->
  <c- p>]</c->
<c- p>}</c->
</pre>
      <p>The <code>clientId</code> field corresponds to a unique context (frame or worker), and is the same value returned by <code class="idl"><a data-link-type="idl" href="https://w3c.github.io/ServiceWorker/#client" id="ref-for-client">Client</a></code>'s <code class="idl"><a data-link-type="idl" href="https://w3c.github.io/ServiceWorker/#dom-client-id" id="ref-for-dom-client-id">id</a></code> attribute.</p>
    </dl>
   </div>
   <aside class="advisement"> This data is just a <em>snapshot</em> of the <a data-link-type="dfn" href="#lock-manager" id="ref-for-lock-manager③">lock manager</a> state at some point in time. By the time the data is returned to script, the actual lock state might have changed. </aside>
   <div class="algorithm">
    <p>The <dfn class="dfn-paneled idl-code" data-dfn-for="LockManager" data-dfn-type="method" data-export id="dom-lockmanager-query"><code>query()</code></dfn> method, when invoked, must run these steps:</p>
    <ol>
     <li data-md>
      <p>Let <var>origin</var> be <a data-link-type="dfn" href="https://dom.spec.whatwg.org/#context-object" id="ref-for-context-object②">context object</a>'s <a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/webappapis.html#relevant-settings-object" id="ref-for-relevant-settings-object②">relevant settings object</a>'s <a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/origin.html#concept-origin" id="ref-for-concept-origin⑤">origin</a>.</p>
     <li data-md>
      <p>If <var>origin</var> is an <a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/origin.html#concept-origin-opaque" id="ref-for-concept-origin-opaque①">opaque origin</a>, then return <a data-link-type="dfn" href="https://www.w3.org/2001/tag/doc/promises-guide/#a-promise-rejected-with" id="ref-for-a-promise-rejected-with⑥">a promise rejected with</a> a "<code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#securityerror" id="ref-for-securityerror①">SecurityError</a></code>" <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-DOMException" id="ref-for-idl-DOMException⑥">DOMException</a></code>.</p>
     <li data-md>
      <p>Let <var>promise</var> be <a data-link-type="dfn" href="https://www.w3.org/2001/tag/doc/promises-guide/#a-new-promise" id="ref-for-a-new-promise①">a new promise</a>.</p>
     <li data-md>
      <p><a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/infrastructure.html#enqueue-the-following-steps" id="ref-for-enqueue-the-following-steps④">Enqueue the steps</a> to <a data-link-type="dfn" href="#snapshot-the-lock-state" id="ref-for-snapshot-the-lock-state">snapshot the lock state</a> for <var>origin</var> with <var>promise</var> to the <a data-link-type="dfn" href="#lock-task-queue" id="ref-for-lock-task-queue③">lock task queue</a>.</p>
     <li data-md>
      <p>Return <var>promise</var>.</p>
    </ol>
   </div>
   <h3 class="heading settled" data-level="3.3" id="api-lock"><span class="secno">3.3. </span><span class="content"><code class="idl"><a data-link-type="idl" href="#lock" id="ref-for-lock②">Lock</a></code> class</span><a class="self-link" href="#api-lock"></a></h3>
<pre class="idl highlight def">[<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#SecureContext" id="ref-for-SecureContext②"><c- g>SecureContext</c-></a>, <a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#Exposed" id="ref-for-Exposed①"><c- g>Exposed</c-></a>=(<c- n>Window</c->,<c- n>Worker</c->)]
<c- b>interface</c-> <dfn class="dfn-paneled idl-code" data-dfn-type="interface" data-export id="lock"><code><c- g>Lock</c-></code></dfn> {
  <c- b>readonly</c-> <c- b>attribute</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-DOMString" id="ref-for-idl-DOMString④"><c- b>DOMString</c-></a> <dfn class="dfn-paneled idl-code" data-dfn-for="Lock" data-dfn-type="attribute" data-export data-readonly data-type="DOMString" id="dom-lock-name"><code><c- g>name</c-></code></dfn>;
  <c- b>readonly</c-> <c- b>attribute</c-> <a class="n" data-link-type="idl-name" href="#enumdef-lockmode" id="ref-for-enumdef-lockmode②"><c- n>LockMode</c-></a> <dfn class="dfn-paneled idl-code" data-dfn-for="Lock" data-dfn-type="attribute" data-export data-readonly data-type="LockMode" id="dom-lock-mode"><code><c- g>mode</c-></code></dfn>;
};
</pre>
   <p>A <code class="idl"><a data-link-type="idl" href="#lock" id="ref-for-lock③">Lock</a></code> object has an associated <a data-link-type="dfn" href="#lock-concept" id="ref-for-lock-concept①⑤">lock</a>.</p>
   <p>The <code class="idl"><a data-link-type="idl" href="#dom-lock-name" id="ref-for-dom-lock-name">name</a></code> attribute getter returns the associated <a data-link-type="dfn" href="#lock-concept" id="ref-for-lock-concept①⑥">lock</a>'s <a data-link-type="dfn" href="#lock-concept-name" id="ref-for-lock-concept-name②">name</a>.</p>
   <p>The <code class="idl"><a data-link-type="idl" href="#dom-lock-mode" id="ref-for-dom-lock-mode">mode</a></code> attribute getter returns the associated <a data-link-type="dfn" href="#lock-concept" id="ref-for-lock-concept①⑦">lock</a>'s <a data-link-type="dfn" href="#lock-concept-mode" id="ref-for-lock-concept-mode①">mode</a>.</p>
   <h2 class="heading settled" data-level="4" id="algorithms"><span class="secno">4. </span><span class="content">Algorithms</span><a class="self-link" href="#algorithms"></a></h2>
   <h3 class="heading settled" data-level="4.1" id="algorithm-request-lock"><span class="secno">4.1. </span><span class="content">Request a lock</span><a class="self-link" href="#algorithm-request-lock"></a></h3>
   <div class="algorithm">
     To <dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport id="request-a-lock">request a lock</dfn> with <var>promise</var>, <var>agent</var>, <var>clientId</var>, <var>origin</var>, <var>callback</var>, <var>name</var>, <var>mode</var>, <var>ifAvailable</var>, <var>steal</var>, and optional <var>signal</var>: 
    <ol>
     <li data-md>
      <p>Let <var>request</var> be a new <a data-link-type="dfn" href="#lock-request" id="ref-for-lock-request⑨">lock request</a> (<var>agent</var>, <var>clientId</var>, <var>origin</var>, <var>name</var>, <var>mode</var>, <var>promise</var>).</p>
     <li data-md>
      <p><a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/infrastructure.html#enqueue-the-following-steps" id="ref-for-enqueue-the-following-steps⑤">Enqueue the following steps</a> to the <a data-link-type="dfn" href="#lock-task-queue" id="ref-for-lock-task-queue④">lock task queue</a>:</p>
      <ol>
       <li data-md>
        <p>Let <var>queueMap</var> be <var>origin</var>’s <a data-link-type="dfn" href="#lock-request-lock-request-queue-map" id="ref-for-lock-request-lock-request-queue-map①">lock request queue map</a>.</p>
       <li data-md>
        <p>Let <var>queue</var> be <var>queueMap</var>[<var>name</var>].</p>
       <li data-md>
        <p>Let <var>held</var> be <var>origin</var>’s <a data-link-type="dfn" href="#lock-concept-held-lock-set" id="ref-for-lock-concept-held-lock-set①">held lock set</a>.</p>
       <li data-md>
        <p>If <var>steal</var> is true, then run these steps:</p>
        <ol>
         <li data-md>
          <p><a data-link-type="dfn" href="https://infra.spec.whatwg.org/#list-iterate" id="ref-for-list-iterate">For each</a> <var>lock</var> of <var>held</var>:</p>
          <ol>
           <li data-md>
            <p>If <var>lock</var>’s <a data-link-type="dfn" href="#lock-concept-name" id="ref-for-lock-concept-name③">name</a> is <var>name</var>, then run these steps:</p>
            <ol>
             <li data-md>
              <p><a data-link-type="dfn" href="https://infra.spec.whatwg.org/#list-remove" id="ref-for-list-remove">Remove</a> <a data-link-type="dfn" href="#lock-concept" id="ref-for-lock-concept①⑧">lock</a> from <var>held</var>.</p>
             <li data-md>
              <p><a data-link-type="dfn" href="https://www.w3.org/2001/tag/doc/promises-guide/#reject-promise" id="ref-for-reject-promise①">Reject</a> <var>lock</var>’s <a data-link-type="dfn" href="#lock-concept-released-promise" id="ref-for-lock-concept-released-promise⑤">released promise</a> with an "<code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#aborterror" id="ref-for-aborterror④">AbortError</a></code>" <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-DOMException" id="ref-for-idl-DOMException⑦">DOMException</a></code>.</p>
            </ol>
          </ol>
         <li data-md>
          <p><a data-link-type="dfn" href="https://infra.spec.whatwg.org/#list-prepend" id="ref-for-list-prepend">Prepend</a> <var>request</var> in <var>queue</var>.</p>
        </ol>
       <li data-md>
        <p>Otherwise, run these steps:</p>
        <ol>
         <li data-md>
          <p>If <var>ifAvailable</var> is true and <var>request</var> is not <a data-link-type="dfn" href="#lock-request-grantable" id="ref-for-lock-request-grantable">grantable</a>,
 then <a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/infrastructure.html#enqueue-the-following-steps" id="ref-for-enqueue-the-following-steps⑥">enqueue the following steps</a> on <var>callback</var>’s <a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/webappapis.html#relevant-settings-object" id="ref-for-relevant-settings-object③">relevant settings object</a>'s <a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/webappapis.html#responsible-event-loop" id="ref-for-responsible-event-loop">responsible event loop</a>:</p>
          <ol>
           <li data-md>
            <p>Let <var>r</var> be the result of <a data-link-type="dfn" href="https://heycam.github.io/webidl/#invoke-a-callback-function" id="ref-for-invoke-a-callback-function">invoking</a> <var>callback</var> with <code>null</code> as the only argument.</p>
           <li data-md>
            <p><a data-link-type="dfn">Resolve</a> <var>promise</var> with <var>r</var> and abort these steps.</p>
          </ol>
         <li data-md>
          <p><a data-link-type="dfn" href="https://infra.spec.whatwg.org/#queue-enqueue" id="ref-for-queue-enqueue">Enqueue</a> <var>request</var> in <var>queue</var>.</p>
        </ol>
       <li data-md>
        <p><a data-link-type="dfn" href="#process-the-lock-request-queue" id="ref-for-process-the-lock-request-queue">Process the lock request queue</a> <var>queue</var>.</p>
      </ol>
     <li data-md>
      <p>Return <var>request</var>.</p>
    </ol>
   </div>
   <h3 class="heading settled" data-level="4.2" id="algorithm-release-lock"><span class="secno">4.2. </span><span class="content">Release a lock</span><a class="self-link" href="#algorithm-release-lock"></a></h3>
   <div class="algorithm">
     To <dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport id="release-the-lock">release the lock</dfn> <var>lock</var>: 
    <ol>
     <li data-md>
      <p><a data-link-type="dfn" href="https://infra.spec.whatwg.org/#assert" id="ref-for-assert">Assert</a>: these steps are running on the <a data-link-type="dfn" href="#lock-task-queue" id="ref-for-lock-task-queue⑤">lock task queue</a>.</p>
     <li data-md>
      <p>Let <var>origin</var> be <var>lock</var>’s <a data-link-type="dfn" href="#lock-concept-origin" id="ref-for-lock-concept-origin">origin</a>.</p>
     <li data-md>
      <p>Let <var>queueMap</var> be <var>origin</var>’s <a data-link-type="dfn" href="#lock-request-lock-request-queue-map" id="ref-for-lock-request-lock-request-queue-map②">lock request queue map</a>.</p>
     <li data-md>
      <p>Let <var>name</var> be <var>lock</var>’s <a data-link-type="dfn" href="#resource-name" id="ref-for-resource-name⑤">resource name</a>.</p>
     <li data-md>
      <p>Let <var>queue</var> be <var>queueMap</var>[<var>name</var>].</p>
     <li data-md>
      <p><a data-link-type="dfn" href="https://infra.spec.whatwg.org/#list-remove" id="ref-for-list-remove①">Remove</a> <a data-link-type="dfn" href="#lock-concept" id="ref-for-lock-concept①⑨">lock</a> from the <var>origin</var>’s <a data-link-type="dfn" href="#lock-concept-held-lock-set" id="ref-for-lock-concept-held-lock-set②">held lock set</a>.</p>
     <li data-md>
      <p><a data-link-type="dfn" href="#process-the-lock-request-queue" id="ref-for-process-the-lock-request-queue①">Process the lock request queue</a> <var>queue</var>.</p>
    </ol>
   </div>
   <h3 class="heading settled" data-level="4.3" id="algorithm-abort-request"><span class="secno">4.3. </span><span class="content">Abort a request</span><a class="self-link" href="#algorithm-abort-request"></a></h3>
   <div class="algorithm">
     To <dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport id="abort-the-request">abort the request</dfn> <var>request</var>: 
    <ol>
     <li data-md>
      <p><a data-link-type="dfn" href="https://infra.spec.whatwg.org/#assert" id="ref-for-assert①">Assert</a>: these steps are running on the <a data-link-type="dfn" href="#lock-task-queue" id="ref-for-lock-task-queue⑥">lock task queue</a>.</p>
     <li data-md>
      <p>Let <var>origin</var> be <var>request</var>’s <a data-link-type="dfn" href="#lock-request-origin" id="ref-for-lock-request-origin①">origin</a>.</p>
     <li data-md>
      <p>Let <var>name</var> be <var>lock</var>’s <a data-link-type="dfn" href="#resource-name" id="ref-for-resource-name⑥">resource name</a>.</p>
     <li data-md>
      <p>Let <var>queueMap</var> be <var>origin</var>’s <a data-link-type="dfn" href="#lock-request-lock-request-queue-map" id="ref-for-lock-request-lock-request-queue-map③">lock request queue map</a>.</p>
     <li data-md>
      <p>Let <var>queue</var> be <var>queueMap</var>[<var>name</var>].</p>
     <li data-md>
      <p><a data-link-type="dfn" href="https://infra.spec.whatwg.org/#list-remove" id="ref-for-list-remove②">Remove</a> <var>request</var> from <var>queue</var>.</p>
     <li data-md>
      <p><a data-link-type="dfn" href="#process-the-lock-request-queue" id="ref-for-process-the-lock-request-queue②">Process the lock request queue</a> <var>queue</var>.</p>
    </ol>
   </div>
   <h3 class="heading settled" data-level="4.4" id="algorithm-process-request"><span class="secno">4.4. </span><span class="content">Process a lock request queue for a given resource name</span><a class="self-link" href="#algorithm-process-request"></a></h3>
   <div class="algorithm">
     To <dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport id="process-the-lock-request-queue">process the lock request queue</dfn> <var>queue</var>: 
    <ol>
     <li data-md>
      <p><a data-link-type="dfn" href="https://infra.spec.whatwg.org/#assert" id="ref-for-assert②">Assert</a>: these steps are running on the <a data-link-type="dfn" href="#lock-task-queue" id="ref-for-lock-task-queue⑦">lock task queue</a>.</p>
     <li data-md>
      <p><a data-link-type="dfn" href="https://infra.spec.whatwg.org/#list-iterate" id="ref-for-list-iterate①">For each</a> <var>request</var> of <var>queue</var>:</p>
      <ol>
       <li data-md>
        <p>If <var>request</var> is <a data-link-type="dfn" href="#lock-request-grantable" id="ref-for-lock-request-grantable①">grantable</a>, then run these steps:</p>
        <ol>
         <li data-md>
          <p><a data-link-type="dfn" href="https://infra.spec.whatwg.org/#list-remove" id="ref-for-list-remove③">Remove</a> <var>request</var> from <var>queue</var>.</p>
         <li data-md>
          <p>Let <var>agent</var> be <var>request</var>’s <a data-link-type="dfn" href="#lock-concept-agent" id="ref-for-lock-concept-agent①">agent</a></p>
         <li data-md>
          <p>Let <var>clientId</var> be <var>request</var>’s <a data-link-type="dfn" href="#lock-request-clientid" id="ref-for-lock-request-clientid">clientId</a>.</p>
         <li data-md>
          <p>Let <var>name</var> be <var>request</var>’s <a data-link-type="dfn" href="#lock-request-name" id="ref-for-lock-request-name①">name</a>.</p>
         <li data-md>
          <p>Let <var>mode</var> be <var>request</var>’s <a data-link-type="dfn" href="#lock-request-mode" id="ref-for-lock-request-mode①">mode</a>.</p>
         <li data-md>
          <p>Let <var>p</var> be <var>request</var>’s <a data-link-type="dfn" href="#lock-request-promise" id="ref-for-lock-request-promise">promise</a>.</p>
         <li data-md>
          <p>Let <var>waiting</var> be <a data-link-type="dfn" href="https://www.w3.org/2001/tag/doc/promises-guide/#a-new-promise" id="ref-for-a-new-promise②">a new promise</a>.</p>
         <li data-md>
          <p>Let <var>lock</var> be a new <a data-link-type="dfn" href="#lock-concept" id="ref-for-lock-concept②⓪">lock</a> with <a data-link-type="dfn" href="#lock-concept-agent" id="ref-for-lock-concept-agent②">agent</a> <var>agent</var>, <a data-link-type="dfn" href="#lock-concept-clientid" id="ref-for-lock-concept-clientid">clientId</a> <var>clientId</var>, <a data-link-type="dfn" href="#lock-concept-origin" id="ref-for-lock-concept-origin①">origin</a> <var>origin</var>, <a data-link-type="dfn" href="#lock-concept-mode" id="ref-for-lock-concept-mode②">mode</a> <var>mode</var>, <a data-link-type="dfn" href="#lock-concept-name" id="ref-for-lock-concept-name④">name</a> <var>name</var>, <a data-link-type="dfn" href="#lock-concept-released-promise" id="ref-for-lock-concept-released-promise⑥">released promise</a> <var>p</var>, and <a data-link-type="dfn" href="#lock-concept-waiting-promise" id="ref-for-lock-concept-waiting-promise⑤">waiting promise</a> <var>waiting</var>.</p>
         <li data-md>
          <p><a data-link-type="dfn" href="https://infra.spec.whatwg.org/#set-append" id="ref-for-set-append">Append</a> <var>lock</var> to <var>origin</var>’s <a data-link-type="dfn" href="#lock-concept-held-lock-set" id="ref-for-lock-concept-held-lock-set③">held lock set</a>.</p>
         <li data-md>
          <p><a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/infrastructure.html#enqueue-the-following-steps" id="ref-for-enqueue-the-following-steps⑦">Enqueue the following steps</a> on <var>callback</var>’s <a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/webappapis.html#relevant-settings-object" id="ref-for-relevant-settings-object④">relevant settings object</a>'s <a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/webappapis.html#responsible-event-loop" id="ref-for-responsible-event-loop①">responsible event loop</a>:</p>
          <ol>
           <li data-md>
            <p>Let <var>r</var> be the result of <a data-link-type="dfn" href="https://heycam.github.io/webidl/#invoke-a-callback-function" id="ref-for-invoke-a-callback-function①">invoking</a> <var>callback</var> with a new <code class="idl"><a data-link-type="idl" href="#lock" id="ref-for-lock④">Lock</a></code> object associated with <var>lock</var> as the only argument.</p>
           <li data-md>
            <p><a data-link-type="dfn">Resolve</a> <var>waiting</var> with <var>r</var>.</p>
          </ol>
        </ol>
      </ol>
    </ol>
   </div>
   <h3 class="heading settled" data-level="4.5" id="algorithm-snapshot-state"><span class="secno">4.5. </span><span class="content">Snapshot the lock state</span><a class="self-link" href="#algorithm-snapshot-state"></a></h3>
   <div class="algorithm">
     To <dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport id="snapshot-the-lock-state">snapshot the lock state</dfn> for <var>origin</var> with <var>promise</var>: 
    <ol>
     <li data-md>
      <p><a data-link-type="dfn" href="https://infra.spec.whatwg.org/#assert" id="ref-for-assert③">Assert</a>: these steps are running on the <a data-link-type="dfn" href="#lock-task-queue" id="ref-for-lock-task-queue⑧">lock task queue</a>.</p>
     <li data-md>
      <p>Let <var>pending</var> be a new <a data-link-type="dfn" href="https://infra.spec.whatwg.org/#list" id="ref-for-list">list</a>.</p>
     <li data-md>
      <p><a data-link-type="dfn" href="https://infra.spec.whatwg.org/#map-iterate" id="ref-for-map-iterate">For each</a> <var>name</var> → <var>queue</var> of <var>origin</var>’s <a data-link-type="dfn" href="#lock-request-lock-request-queue-map" id="ref-for-lock-request-lock-request-queue-map④">lock request queue map</a>:</p>
      <ol>
       <li data-md>
        <p><a data-link-type="dfn" href="https://infra.spec.whatwg.org/#list-iterate" id="ref-for-list-iterate②">For each</a> <var>request</var> of <var>queue</var>:</p>
        <ol>
         <li data-md>
          <p><a data-link-type="dfn" href="https://infra.spec.whatwg.org/#list-append" id="ref-for-list-append">Append</a> «[ "name" → <var>request</var>’s <a data-link-type="dfn" href="#lock-request-name" id="ref-for-lock-request-name②">name</a>, "mode" → <var>request</var>’s <a data-link-type="dfn" href="#lock-request-mode" id="ref-for-lock-request-mode②">mode</a>, "clientId" → <var>request</var>’s <a data-link-type="dfn" href="#lock-request-clientid" id="ref-for-lock-request-clientid①">clientId</a> ]» to <var>pending</var>.</p>
        </ol>
      </ol>
     <li data-md>
      <p>Let <var>held</var> be a new <a data-link-type="dfn" href="https://infra.spec.whatwg.org/#list" id="ref-for-list①">list</a>.</p>
     <li data-md>
      <p><a data-link-type="dfn" href="https://infra.spec.whatwg.org/#list-iterate" id="ref-for-list-iterate③">For each</a> <var>lock</var> of <var>origin</var>’s <a data-link-type="dfn" href="#lock-concept-held-lock-set" id="ref-for-lock-concept-held-lock-set④">held lock set</a>:</p>
      <ol>
       <li data-md>
        <p><a data-link-type="dfn" href="https://infra.spec.whatwg.org/#list-append" id="ref-for-list-append①">Append</a> «[ "name" → <var>lock</var>’s <a data-link-type="dfn" href="#lock-concept-name" id="ref-for-lock-concept-name⑤">name</a>, "mode" → <var>lock</var>’s <a data-link-type="dfn" href="#lock-concept-mode" id="ref-for-lock-concept-mode③">mode</a>, "clientId" → <var>lock</var>’s <a data-link-type="dfn" href="#lock-concept-clientid" id="ref-for-lock-concept-clientid①">clientId</a> ]» to <var>held</var>.</p>
      </ol>
     <li data-md>
      <p><a data-link-type="dfn">Resolve</a> <var>promise</var> with «[ "held" → <var>held</var>, "pending" → <var>pending</var> ]».</p>
    </ol>
   </div>
   <aside class="note">
    <p> For any given resource, the snapshot of the pending lock requests
    will return the requests in the order in which they were made;
    however, no guarantees are made with respect to the relative
    ordering of requests across different resources. For example, if
    pending lock requests A1 and A2 are made against resource A in
    that order, and pending lock requests B1 and B2 are made against
    resource B in that order, than both «A1, A2, B1, B2» and «A1, B1,
    A2, B2» would be possible orderings for a snapshot’s pending list. </p>
    <p> No ordering guarantees exist for the snapshot of the held lock state. </p>
   </aside>
   <h2 class="heading settled" data-level="5" id="usage-considerations"><span class="secno">5. </span><span class="content">Usage Considerations</span><a class="self-link" href="#usage-considerations"></a></h2>
   <p><em>This section is non-normative.</em></p>
   <h3 class="heading settled" data-level="5.1" id="deadlocks"><span class="secno">5.1. </span><span class="content">Deadlocks</span><a class="self-link" href="#deadlocks"></a></h3>
   <p><a href="https://en.wikipedia.org/wiki/Deadlock">Deadlocks</a> are a concept in concurrent computing, and deadlocks scoped to a particular <a data-link-type="dfn" href="#lock-manager" id="ref-for-lock-manager④">lock manager</a> can be introduced by this API.</p>
   <aside class="example" id="example-deadlocks">
    <a class="self-link" href="#example-deadlocks"></a> An example of how deadlocks can be encountered through the use of this API is as follows. 
    <p>Script 1:</p>
<pre class="language-js highlight">navigator<c- p>.</c->locks<c- p>.</c->request<c- p>(</c-><c- t>'A'</c-><c- p>,</c-> async a <c- p>=></c-> <c- p>{</c->
  await navigator<c- p>.</c->locks<c- p>.</c->request<c- p>(</c-><c- t>'B'</c-><c- p>,</c-> async b <c- p>=></c-> <c- p>{</c->
    <c- c1>// do stuff with A and B</c->
  <c- p>});</c->
<c- p>});</c->
</pre>
    <p>Script 2:</p>
<pre class="language-js highlight">navigator<c- p>.</c->locks<c- p>.</c->request<c- p>(</c-><c- t>'B'</c-><c- p>,</c-> async b <c- p>=></c-> <c- p>{</c->
  await navigator<c- p>.</c->locks<c- p>.</c->request<c- p>(</c-><c- t>'A'</c-><c- p>,</c-> async a <c- p>=></c-> <c- p>{</c->
    <c- c1>// do stuff with A and B</c->
  <c- p>});</c->
<c- p>});</c->
</pre>
    <p>If script 1 and script 2 run close to the same time, there is a chance that script 1 will hold lock A and script 2 will hold lock B and neither can make further progress - a deadlock. This will not affect the user agent as a whole, pause the tab, or affect other script in the origin, but this particular functionality will be blocked.</p>
   </aside>
   <p>Preventing deadlocks requires care. One approach is to always acquire multiple locks in a strict order.</p>
   <aside class="example" id="example-request-multiple-locks">
    <a class="self-link" href="#example-request-multiple-locks"></a> 
    <p>A helper function such as the following could be used to request multiple locks in a consistent order.</p>
<pre class="language-js highlight">async <c- a>function</c-> requestMultiple<c- p>(</c->resources<c- p>,</c-> callback<c- p>)</c-> <c- p>{</c->
  <c- kr>const</c-> sortedResources <c- o>=</c-> <c- p>[...</c->resources<c- p>];</c->
  sortedResources<c- p>.</c->sort<c- p>();</c-> <c- c1>// Always request in the same order.</c->

  async <c- a>function</c-> requestNext<c- p>(</c->locks<c- p>)</c-> <c- p>{</c->
    <c- k>return</c-> await navigator<c- p>.</c->locks<c- p>.</c->request<c- p>(</c->sortedResources<c- p>.</c->shift<c- p>(),</c-> async lock <c- p>=></c-> <c- p>{</c->
      <c- c1>// Now holding this lock, plus all previously requested locks.</c->
      locks<c- p>.</c->push<c- p>(</c->lock<c- p>);</c->

      <c- c1>// Recursively request the next lock in order if needed.</c->
      <c- k>if</c-> <c- p>(</c->sortedResources<c- p>.</c->length <c- o>></c-> <c- mi>0</c-><c- p>)</c->
        <c- k>return</c-> await requestNext<c- p>(</c->locks<c- p>);</c->

      <c- c1>// Otherwise, run the callback.</c->
      <c- k>return</c-> await callback<c- p>(</c->locks<c- p>);</c->

      <c- c1>// All locks will be released when the callback returns (or throws).</c->
    <c- p>});</c->
  <c- p>}</c->
  <c- k>return</c-> await requestNext<c- p>([]);</c->
<c- p>}</c->
</pre>
    <p>In practice, the use of multiple locks is rarely as straightforward — libraries and other utilities can often unintentionally obfuscate their use.</p>
   </aside>
   <h2 class="heading settled" data-level="6" id="security-privacy"><span class="secno">6. </span><span class="content">Security and Privacy Considerations</span><a class="self-link" href="#security-privacy"></a></h2>
   <h3 class="heading settled" data-level="6.1" id="security-scope"><span class="secno">6.1. </span><span class="content">Lock Scope</span><a class="self-link" href="#security-scope"></a></h3>
   <p>The definition of a <a data-link-type="dfn" href="#lock-manager" id="ref-for-lock-manager⑤">lock manager</a>'s scope is important as it defines a privacy boundary. Locks can be used as an ephemeral state retention mechanism and, like storage APIs, can be used as a communication mechanism, and must be no more privileged than storage facilities. User agents that impose finer granularity on one of these services must impose it on others; for example, a user agent that exposes different storage partitions to a top-level page (first-party) and a cross-origin iframe (third-party) in the same origin for privacy reasons must similarly partition locking.</p>
   <p>This also provides reasonable expectations for web application authors; if a lock is acquired over a storage resource, all same-origin browsing contexts must observe the same state.</p>
   <h3 class="heading settled" data-level="6.2" id="private-browsing"><span class="secno">6.2. </span><span class="content">Private Browsing</span><a class="self-link" href="#private-browsing"></a></h3>
   <p>Every <a href="https://github.com/w3ctag/private-mode">private mode</a> browsing session is considered a separate user agent for the purposes of this API. That is, locks requested/held outside such a session have no affect on requested/held inside such a session, and vice versa. This prevents a website from determining that a session is "incognito" while also not allowing a communication mechanism between such sessions.</p>
   <h3 class="heading settled" data-level="6.3" id="implementation-risks"><span class="secno">6.3. </span><span class="content">Implementation Risks</span><a class="self-link" href="#implementation-risks"></a></h3>
   <p>Implementations must ensure that locks do not span origins. Failure to do so would provide a side-channel for communication between script running in two origins, or allow one script in one origin to disrupt the behavior of another (e.g. denying service).</p>
   <h3 class="heading settled" data-level="6.4" id="security-privacy-checklist"><span class="secno">6.4. </span><span class="content">Checklist</span><a class="self-link" href="#security-privacy-checklist"></a></h3>
   <p>The W3C TAG has developed a <a href="https://www.w3.org/TR/security-privacy-questionnaire/">Self-Review Questionnaire: Security and Privacy</a> for editors of specifications to informatively answer. Revisiting the questions here:</p>
   <ul>
    <li data-md>
     <p>The specification does not deal with personally identifiable information, or high-value data.</p>
    <li data-md>
     <p>No new state for an origin that persists across browsing sessions is introduced.</p>
    <li data-md>
     <p>No new persistent, cross-origin state is exposed to the web.</p>
    <li data-md>
     <p>No new data is exposed to an origin that it doesn’t currently have access to (e.g. via polling <a data-link-type="biblio" href="#biblio-indexeddb-2">[IndexedDB-2]</a>.)</p>
    <li data-md>
     <p>No new script execution/loading mechanisms are enabled.</p>
    <li data-md>
     <p>This specification does not allow an origin access to any of the following:</p>
     <ul>
      <li data-md>
       <p>The user’s location.</p>
      <li data-md>
       <p>Sensors on a user’s device.</p>
      <li data-md>
       <p>Aspects of a user’s local computing environment.</p>
      <li data-md>
       <p>Access to other devices.</p>
      <li data-md>
       <p>Any measure of control over a user agent’s native UI.</p>
     </ul>
    <li data-md>
     <p>No temporary identifiers to the web are exposed to the web. All <a data-link-type="dfn" href="#resource-name" id="ref-for-resource-name⑦">resource names</a> are provided by the web application itself.</p>
    <li data-md>
     <p>Behavior in first-party and third-party contexts is distinguished in a user agent if storage is distinguished. See <a href="#security-scope">§ 6.1 Lock Scope</a>.</p>
    <li data-md>
     <p>Behavior in the context of a user agent’s "incognito" mode is described in <a href="#private-browsing">§ 6.2 Private Browsing</a>.</p>
    <li data-md>
     <p>No data is persisted to a user’s local device by this API.</p>
    <li data-md>
     <p>This API does not allow downgrading default security characteristics.</p>
   </ul>
   <h2 class="heading settled" data-level="7" id="acknowledgements"><span class="secno">7. </span><span class="content">Acknowledgements</span><a class="self-link" href="#acknowledgements"></a></h2>
   <p>Many thanks to
Alex Russell,
Andreas Butler,
Anne van Kesteren,
Boris Zbarsky,
Darin Fisher,
Domenic Denicola,
Gus Caplan,
Harald Alvestrand,
Jake Archibald,
L. David Baron,
Luciano Pacheco,
Marcos Caceres,
Ralph Chelala,
Raymond Toy,
Ryan Fioravanti,
and
Victor Costan
for helping craft this proposal.</p>
   <p>Special thanks to Tab Atkins, Jr. for creating and maintaining <a href="https://github.com/tabatkins/bikeshed">Bikeshed</a>, the specification
authoring tool used to create this document, and for his general
authoring advice.</p>
  </main>
  <div data-fill-with="conformance">
   <h2 class="no-ref no-num heading settled" id="conformance"><span class="content"> Conformance</span><a class="self-link" href="#conformance"></a></h2>
   <p> Conformance requirements are expressed with a combination of descriptive assertions and RFC 2119 terminology.
            The key words “MUST”, “MUST NOT”, “REQUIRED”, “SHALL”, “SHALL NOT”, “SHOULD”, “SHOULD NOT”, “RECOMMENDED”, “MAY”, and “OPTIONAL”
            in the normative parts of this document
            are to be interpreted as described in RFC 2119.
            However, for readability,
            these words do not appear in all uppercase letters in this specification. </p>
   <p> All of the text of this specification is normative
            except sections explicitly marked as non-normative, examples, and notes. <a data-link-type="biblio" href="#biblio-rfc2119">[RFC2119]</a> </p>
   <p> Examples in this specification are introduced with the words “for example”
            or are set apart from the normative text with <code>class="example"</code>, like this: </p>
   <div class="example" id="example-example"><a class="self-link" href="#example-example"></a> This is an example of an informative example. </div>
   <p> Informative notes begin with the word “Note”
            and are set apart from the normative text with <code>class="note"</code>, like this: </p>
   <p class="note" role="note"> Note, this is an informative note. </p>
  </div>
<script>
(function() {
  "use strict";
  var collapseSidebarText = '<span aria-hidden="true">←</span> '
                          + '<span>Collapse Sidebar</span>';
  var expandSidebarText   = '<span aria-hidden="true">→</span> '
                          + '<span>Pop Out Sidebar</span>';
  var tocJumpText         = '<span aria-hidden="true">↑</span> '
                          + '<span>Jump to Table of Contents</span>';

  var sidebarMedia = window.matchMedia('screen and (min-width: 78em)');
  var autoToggle   = function(e){ toggleSidebar(e.matches) };
  if(sidebarMedia.addListener) {
    sidebarMedia.addListener(autoToggle);
  }

  function toggleSidebar(on) {
    if (on == undefined) {
      on = !document.body.classList.contains('toc-sidebar');
    }

    /* Don’t scroll to compensate for the ToC if we’re above it already. */
    var headY = 0;
    var head = document.querySelector('.head');
    if (head) {
      // terrible approx of "top of ToC"
      headY += head.offsetTop + head.offsetHeight;
    }
    var skipScroll = window.scrollY < headY;

    var toggle = document.getElementById('toc-toggle');
    var tocNav = document.getElementById('toc');
    if (on) {
      var tocHeight = tocNav.offsetHeight;
      document.body.classList.add('toc-sidebar');
      document.body.classList.remove('toc-inline');
      toggle.innerHTML = collapseSidebarText;
      if (!skipScroll) {
        window.scrollBy(0, 0 - tocHeight);
      }
      tocNav.focus();
      sidebarMedia.addListener(autoToggle); // auto-collapse when out of room
    }
    else {
      document.body.classList.add('toc-inline');
      document.body.classList.remove('toc-sidebar');
      toggle.innerHTML = expandSidebarText;
      if (!skipScroll) {
        window.scrollBy(0, tocNav.offsetHeight);
      }
      if (toggle.matches(':hover')) {
        /* Unfocus button when not using keyboard navigation,
           because I don’t know where else to send the focus. */
        toggle.blur();
      }
    }
  }

  function createSidebarToggle() {
    /* Create the sidebar toggle in JS; it shouldn’t exist when JS is off. */
    var toggle = document.createElement('a');
      /* This should probably be a button, but appearance isn’t standards-track.*/
    toggle.id = 'toc-toggle';
    toggle.class = 'toc-toggle';
    toggle.href = '#toc';
    toggle.innerHTML = collapseSidebarText;

    sidebarMedia.addListener(autoToggle);
    var toggler = function(e) {
      e.preventDefault();
      sidebarMedia.removeListener(autoToggle); // persist explicit off states
      toggleSidebar();
      return false;
    }
    toggle.addEventListener('click', toggler, false);


    /* Get <nav id=toc-nav>, or make it if we don’t have one. */
    var tocNav = document.getElementById('toc-nav');
    if (!tocNav) {
      tocNav = document.createElement('p');
      tocNav.id = 'toc-nav';
      /* Prepend for better keyboard navigation */
      document.body.insertBefore(tocNav, document.body.firstChild);
    }
    /* While we’re at it, make sure we have a Jump to Toc link. */
    var tocJump = document.getElementById('toc-jump');
    if (!tocJump) {
      tocJump = document.createElement('a');
      tocJump.id = 'toc-jump';
      tocJump.href = '#toc';
      tocJump.innerHTML = tocJumpText;
      tocNav.appendChild(tocJump);
    }

    tocNav.appendChild(toggle);
  }

  var toc = document.getElementById('toc');
  if (toc) {
    createSidebarToggle();
    toggleSidebar(sidebarMedia.matches);

    /* If the sidebar has been manually opened and is currently overlaying the text
       (window too small for the MQ to add the margin to body),
       then auto-close the sidebar once you click on something in there. */
    toc.addEventListener('click', function(e) {
      if(e.target.tagName.toLowerCase() == "a" && document.body.classList.contains('toc-sidebar') && !sidebarMedia.matches) {
        toggleSidebar(false);
      }
    }, false);
  }
  else {
    console.warn("Can’t find Table of Contents. Please use <nav id='toc'> around the ToC.");
  }

  /* Wrap tables in case they overflow */
  var tables = document.querySelectorAll(':not(.overlarge) > table.data, :not(.overlarge) > table.index');
  var numTables = tables.length;
  for (var i = 0; i < numTables; i++) {
    var table = tables[i];
    var wrapper = document.createElement('div');
    wrapper.className = 'overlarge';
    table.parentNode.insertBefore(wrapper, table);
    wrapper.appendChild(table);
  }

})();
</script>
  <h2 class="no-num no-ref heading settled" id="index"><span class="content">Index</span><a class="self-link" href="#index"></a></h2>
  <h3 class="no-num no-ref heading settled" id="index-defined-here"><span class="content">Terms defined by this specification</span><a class="self-link" href="#index-defined-here"></a></h3>
  <ul class="index">
   <li><a href="#abort-the-request">abort the request</a><span>, in §4.3</span>
   <li>
    agent
    <ul>
     <li><a href="#lock-request-agent">dfn for lock request</a><span>, in §2.5</span>
     <li><a href="#lock-concept-agent">dfn for lock-concept</a><span>, in §2.4</span>
    </ul>
   <li>
    clientId
    <ul>
     <li><a href="#lock-request-clientid">dfn for lock request</a><span>, in §2.5</span>
     <li><a href="#lock-concept-clientid">dfn for lock-concept</a><span>, in §2.4</span>
     <li><a href="#dom-lockinfo-clientid">dict-member for LockInfo</a><span>, in §3.2</span>
    </ul>
   <li><a href="#dom-lockmode-exclusive">"exclusive"</a><span>, in §3.2</span>
   <li><a href="#lock-request-grantable">grantable</a><span>, in §2.5</span>
   <li><a href="#dom-lockmanagersnapshot-held">held</a><span>, in §3.2</span>
   <li><a href="#lock-concept-held-lock-set">held lock set</a><span>, in §2.4</span>
   <li><a href="#dom-lockoptions-ifavailable">ifAvailable</a><span>, in §3.2</span>
   <li><a href="#lock">Lock</a><span>, in §3.3</span>
   <li><a href="#lock-concept">lock-concept</a><span>, in §2.4</span>
   <li><a href="#callbackdef-lockgrantedcallback">LockGrantedCallback</a><span>, in §3.2</span>
   <li><a href="#dictdef-lockinfo">LockInfo</a><span>, in §3.2</span>
   <li><a href="#lockmanager">LockManager</a><span>, in §3.2</span>
   <li><a href="#lock-manager">lock manager</a><span>, in §2.2</span>
   <li><a href="#dictdef-lockmanagersnapshot">LockManagerSnapshot</a><span>, in §3.2</span>
   <li><a href="#enumdef-lockmode">LockMode</a><span>, in §3.2</span>
   <li><a href="#dictdef-lockoptions">LockOptions</a><span>, in §3.2</span>
   <li><a href="#lock-request">lock request</a><span>, in §2.5</span>
   <li><a href="#lock-request-lock-request-queue">lock request queue</a><span>, in §2.5</span>
   <li><a href="#lock-request-lock-request-queue-map">lock request queue map</a><span>, in §2.5</span>
   <li><a href="#dom-navigatorlocks-locks">locks</a><span>, in §3.1</span>
   <li><a href="#lock-task-queue">lock task queue</a><span>, in §2</span>
   <li>
    mode
    <ul>
     <li><a href="#dom-lock-mode">attribute for Lock</a><span>, in §3.3</span>
     <li><a href="#mode">definition of</a><span>, in §2.3</span>
     <li><a href="#lock-request-mode">dfn for lock request</a><span>, in §2.5</span>
     <li><a href="#lock-concept-mode">dfn for lock-concept</a><span>, in §2.4</span>
     <li><a href="#dom-lockinfo-mode">dict-member for LockInfo</a><span>, in §3.2</span>
     <li><a href="#dom-lockoptions-mode">dict-member for LockOptions</a><span>, in §3.2</span>
    </ul>
   <li>
    name
    <ul>
     <li><a href="#dom-lock-name">attribute for Lock</a><span>, in §3.3</span>
     <li><a href="#lock-request-name">dfn for lock request</a><span>, in §2.5</span>
     <li><a href="#lock-concept-name">dfn for lock-concept</a><span>, in §2.4</span>
     <li><a href="#dom-lockinfo-name">dict-member for LockInfo</a><span>, in §3.2</span>
    </ul>
   <li><a href="#navigatorlocks">NavigatorLocks</a><span>, in §3.1</span>
   <li>
    origin
    <ul>
     <li><a href="#lock-request-origin">dfn for lock request</a><span>, in §2.5</span>
     <li><a href="#lock-concept-origin">dfn for lock-concept</a><span>, in §2.4</span>
    </ul>
   <li><a href="#dom-lockmanagersnapshot-pending">pending</a><span>, in §3.2</span>
   <li><a href="#process-the-lock-request-queue">process the lock request queue</a><span>, in §4.4</span>
   <li><a href="#lock-request-promise">promise</a><span>, in §2.5</span>
   <li><a href="#dom-lockmanager-query">query()</a><span>, in §3.2.2</span>
   <li><a href="#lock-concept-released-promise">released promise</a><span>, in §2.4</span>
   <li><a href="#release-the-lock">release the lock</a><span>, in §4.2</span>
   <li><a href="#request-a-lock">request a lock</a><span>, in §4.1</span>
   <li><a href="#dom-lockmanager-request">request(name, callback)</a><span>, in §3.2.1</span>
   <li><a href="#dom-lockmanager-request-name-options-callback">request(name, options, callback)</a><span>, in §3.2.1</span>
   <li><a href="#resource-name">resource name</a><span>, in §2.1</span>
   <li><a href="#dom-lockmode-shared">"shared"</a><span>, in §3.2</span>
   <li><a href="#dom-lockoptions-signal">signal</a><span>, in §3.2</span>
   <li><a href="#snapshot-the-lock-state">snapshot the lock state</a><span>, in §4.5</span>
   <li><a href="#dom-lockoptions-steal">steal</a><span>, in §3.2</span>
   <li><a href="#lock-concept-waiting-promise">waiting promise</a><span>, in §2.4</span>
   <li><a href="#web-locks-tasks-source">web locks tasks source</a><span>, in §2</span>
  </ul>
  <aside class="dfn-panel" data-for="term-for-abortsignal">
   <a href="https://dom.spec.whatwg.org/#abortsignal">https://dom.spec.whatwg.org/#abortsignal</a><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-abortsignal">3.2. LockManager class</a>
    <li><a href="#ref-for-abortsignal①">3.2.1. The request() method</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="term-for-abortsignal-aborted-flag">
   <a href="https://dom.spec.whatwg.org/#abortsignal-aborted-flag">https://dom.spec.whatwg.org/#abortsignal-aborted-flag</a><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-abortsignal-aborted-flag">3.2.1. The request() method</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="term-for-abortsignal-add">
   <a href="https://dom.spec.whatwg.org/#abortsignal-add">https://dom.spec.whatwg.org/#abortsignal-add</a><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-abortsignal-add">3.2.1. The request() method</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="term-for-context-object">
   <a href="https://dom.spec.whatwg.org/#context-object">https://dom.spec.whatwg.org/#context-object</a><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-context-object">3.1. Navigator Mixins</a>
    <li><a href="#ref-for-context-object①">3.2.1. The request() method</a>
    <li><a href="#ref-for-context-object②">3.2.2. The query() method</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="term-for-agent">
   <a href="https://tc39.github.io/ecma262/#agent">https://tc39.github.io/ecma262/#agent</a><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-agent">1. Introduction</a> <a href="#ref-for-agent①">(2)</a>
    <li><a href="#ref-for-agent②">2.2. Lock Managers</a>
    <li><a href="#ref-for-agent③">2.4. Locks</a>
    <li><a href="#ref-for-agent④">2.6. Agent Integration</a>
    <li><a href="#ref-for-agent⑤">3.2.1. The request() method</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="term-for-navigator">
   <a href="https://html.spec.whatwg.org/multipage/system-state.html#navigator">https://html.spec.whatwg.org/multipage/system-state.html#navigator</a><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-navigator">3.1. Navigator Mixins</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="term-for-workernavigator">
   <a href="https://html.spec.whatwg.org/multipage/workers.html#workernavigator">https://html.spec.whatwg.org/multipage/workers.html#workernavigator</a><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-workernavigator">3.1. Navigator Mixins</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="term-for-integration-with-the-javascript-agent-cluster-formalism">
   <a href="https://html.spec.whatwg.org/multipage/webappapis.html#integration-with-the-javascript-agent-cluster-formalism">https://html.spec.whatwg.org/multipage/webappapis.html#integration-with-the-javascript-agent-cluster-formalism</a><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-integration-with-the-javascript-agent-cluster-formalism">1. Introduction</a> <a href="#ref-for-integration-with-the-javascript-agent-cluster-formalism①">(2)</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="term-for-browsing-context">
   <a href="https://html.spec.whatwg.org/multipage/browsers.html#browsing-context">https://html.spec.whatwg.org/multipage/browsers.html#browsing-context</a><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-browsing-context">2.1. Resources Names</a>
    <li><a href="#ref-for-browsing-context①">2.2. Lock Managers</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="term-for-enqueue-the-following-steps">
   <a href="https://html.spec.whatwg.org/multipage/infrastructure.html#enqueue-the-following-steps">https://html.spec.whatwg.org/multipage/infrastructure.html#enqueue-the-following-steps</a><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-enqueue-the-following-steps">2. Concepts</a>
    <li><a href="#ref-for-enqueue-the-following-steps①">2.4. Locks</a>
    <li><a href="#ref-for-enqueue-the-following-steps②">2.6. Agent Integration</a>
    <li><a href="#ref-for-enqueue-the-following-steps③">3.2.1. The request() method</a>
    <li><a href="#ref-for-enqueue-the-following-steps④">3.2.2. The query() method</a>
    <li><a href="#ref-for-enqueue-the-following-steps⑤">4.1. Request a lock</a> <a href="#ref-for-enqueue-the-following-steps⑥">(2)</a>
    <li><a href="#ref-for-enqueue-the-following-steps⑦">4.4. Process a lock request queue for a given resource name</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="term-for-enqueue-the-following-steps">
   <a href="https://html.spec.whatwg.org/multipage/infrastructure.html#enqueue-the-following-steps">https://html.spec.whatwg.org/multipage/infrastructure.html#enqueue-the-following-steps</a><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-enqueue-the-following-steps">2. Concepts</a>
    <li><a href="#ref-for-enqueue-the-following-steps①">2.4. Locks</a>
    <li><a href="#ref-for-enqueue-the-following-steps②">2.6. Agent Integration</a>
    <li><a href="#ref-for-enqueue-the-following-steps③">3.2.1. The request() method</a>
    <li><a href="#ref-for-enqueue-the-following-steps④">3.2.2. The query() method</a>
    <li><a href="#ref-for-enqueue-the-following-steps⑤">4.1. Request a lock</a> <a href="#ref-for-enqueue-the-following-steps⑥">(2)</a>
    <li><a href="#ref-for-enqueue-the-following-steps⑦">4.4. Process a lock request queue for a given resource name</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="term-for-environment-settings-object">
   <a href="https://html.spec.whatwg.org/multipage/webappapis.html#environment-settings-object">https://html.spec.whatwg.org/multipage/webappapis.html#environment-settings-object</a><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-environment-settings-object">3.1. Navigator Mixins</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="term-for-concept-environment-id">
   <a href="https://html.spec.whatwg.org/multipage/webappapis.html#concept-environment-id">https://html.spec.whatwg.org/multipage/webappapis.html#concept-environment-id</a><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-concept-environment-id">3.2.1. The request() method</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="term-for-dom-localstorage">
   <a href="https://html.spec.whatwg.org/multipage/webstorage.html#dom-localstorage">https://html.spec.whatwg.org/multipage/webstorage.html#dom-localstorage</a><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-dom-localstorage">2.2. Lock Managers</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="term-for-concept-origin-opaque">
   <a href="https://html.spec.whatwg.org/multipage/origin.html#concept-origin-opaque">https://html.spec.whatwg.org/multipage/origin.html#concept-origin-opaque</a><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-concept-origin-opaque">3.2.1. The request() method</a>
    <li><a href="#ref-for-concept-origin-opaque①">3.2.2. The query() method</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="term-for-concept-origin">
   <a href="https://html.spec.whatwg.org/multipage/origin.html#concept-origin">https://html.spec.whatwg.org/multipage/origin.html#concept-origin</a><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-concept-origin">2.1. Resources Names</a>
    <li><a href="#ref-for-concept-origin①">2.2. Lock Managers</a> <a href="#ref-for-concept-origin②">(2)</a>
    <li><a href="#ref-for-concept-origin③">2.4. Locks</a>
    <li><a href="#ref-for-concept-origin④">3.2.1. The request() method</a>
    <li><a href="#ref-for-concept-origin⑤">3.2.2. The query() method</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="term-for-relevant-settings-object">
   <a href="https://html.spec.whatwg.org/multipage/webappapis.html#relevant-settings-object">https://html.spec.whatwg.org/multipage/webappapis.html#relevant-settings-object</a><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-relevant-settings-object">3.1. Navigator Mixins</a>
    <li><a href="#ref-for-relevant-settings-object①">3.2.1. The request() method</a>
    <li><a href="#ref-for-relevant-settings-object②">3.2.2. The query() method</a>
    <li><a href="#ref-for-relevant-settings-object③">4.1. Request a lock</a>
    <li><a href="#ref-for-relevant-settings-object④">4.4. Process a lock request queue for a given resource name</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="term-for-responsible-event-loop">
   <a href="https://html.spec.whatwg.org/multipage/webappapis.html#responsible-event-loop">https://html.spec.whatwg.org/multipage/webappapis.html#responsible-event-loop</a><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-responsible-event-loop">4.1. Request a lock</a>
    <li><a href="#ref-for-responsible-event-loop①">4.4. Process a lock request queue for a given resource name</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="term-for-starting-a-new-parallel-queue">
   <a href="https://html.spec.whatwg.org/multipage/infrastructure.html#starting-a-new-parallel-queue">https://html.spec.whatwg.org/multipage/infrastructure.html#starting-a-new-parallel-queue</a><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-starting-a-new-parallel-queue">2. Concepts</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="term-for-task-source">
   <a href="https://html.spec.whatwg.org/multipage/webappapis.html#task-source">https://html.spec.whatwg.org/multipage/webappapis.html#task-source</a><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-task-source">2. Concepts</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="term-for-set-append">
   <a href="https://infra.spec.whatwg.org/#set-append">https://infra.spec.whatwg.org/#set-append</a><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-set-append">4.4. Process a lock request queue for a given resource name</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="term-for-assert">
   <a href="https://infra.spec.whatwg.org/#assert">https://infra.spec.whatwg.org/#assert</a><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-assert">4.2. Release a lock</a>
    <li><a href="#ref-for-assert①">4.3. Abort a request</a>
    <li><a href="#ref-for-assert②">4.4. Process a lock request queue for a given resource name</a>
    <li><a href="#ref-for-assert③">4.5. Snapshot the lock state</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="term-for-queue-enqueue">
   <a href="https://infra.spec.whatwg.org/#queue-enqueue">https://infra.spec.whatwg.org/#queue-enqueue</a><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-queue-enqueue">4.1. Request a lock</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="term-for-map-iterate">
   <a href="https://infra.spec.whatwg.org/#map-iterate">https://infra.spec.whatwg.org/#map-iterate</a><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-map-iterate">4.5. Snapshot the lock state</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="term-for-javascript-string">
   <a href="https://infra.spec.whatwg.org/#javascript-string">https://infra.spec.whatwg.org/#javascript-string</a><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-javascript-string">2.1. Resources Names</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="term-for-list">
   <a href="https://infra.spec.whatwg.org/#list">https://infra.spec.whatwg.org/#list</a><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-list">4.5. Snapshot the lock state</a> <a href="#ref-for-list①">(2)</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="term-for-ordered-map">
   <a href="https://infra.spec.whatwg.org/#ordered-map">https://infra.spec.whatwg.org/#ordered-map</a><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-ordered-map">2.5. Lock Requests</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="term-for-list-prepend">
   <a href="https://infra.spec.whatwg.org/#list-prepend">https://infra.spec.whatwg.org/#list-prepend</a><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-list-prepend">4.1. Request a lock</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="term-for-queue">
   <a href="https://infra.spec.whatwg.org/#queue">https://infra.spec.whatwg.org/#queue</a><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-queue">2.5. Lock Requests</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="term-for-list-remove">
   <a href="https://infra.spec.whatwg.org/#list-remove">https://infra.spec.whatwg.org/#list-remove</a><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-list-remove">4.1. Request a lock</a>
    <li><a href="#ref-for-list-remove①">4.2. Release a lock</a>
    <li><a href="#ref-for-list-remove②">4.3. Abort a request</a>
    <li><a href="#ref-for-list-remove③">4.4. Process a lock request queue for a given resource name</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="term-for-ordered-set">
   <a href="https://infra.spec.whatwg.org/#ordered-set">https://infra.spec.whatwg.org/#ordered-set</a><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-ordered-set">2.4. Locks</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="term-for-a-new-promise">
   <a href="https://www.w3.org/2001/tag/doc/promises-guide/#a-new-promise">https://www.w3.org/2001/tag/doc/promises-guide/#a-new-promise</a><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-a-new-promise">3.2.1. The request() method</a>
    <li><a href="#ref-for-a-new-promise①">3.2.2. The query() method</a>
    <li><a href="#ref-for-a-new-promise②">4.4. Process a lock request queue for a given resource name</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="term-for-a-promise-rejected-with">
   <a href="https://www.w3.org/2001/tag/doc/promises-guide/#a-promise-rejected-with">https://www.w3.org/2001/tag/doc/promises-guide/#a-promise-rejected-with</a><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-a-promise-rejected-with">3.2.1. The request() method</a> <a href="#ref-for-a-promise-rejected-with①">(2)</a> <a href="#ref-for-a-promise-rejected-with②">(3)</a> <a href="#ref-for-a-promise-rejected-with③">(4)</a> <a href="#ref-for-a-promise-rejected-with④">(5)</a> <a href="#ref-for-a-promise-rejected-with⑤">(6)</a>
    <li><a href="#ref-for-a-promise-rejected-with⑥">3.2.2. The query() method</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="term-for-reject-promise">
   <a href="https://www.w3.org/2001/tag/doc/promises-guide/#reject-promise">https://www.w3.org/2001/tag/doc/promises-guide/#reject-promise</a><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-reject-promise">3.2.1. The request() method</a>
    <li><a href="#ref-for-reject-promise①">4.1. Request a lock</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="term-for-client">
   <a href="https://w3c.github.io/ServiceWorker/#client">https://w3c.github.io/ServiceWorker/#client</a><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-client">3.2.2. The query() method</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="term-for-dom-client-id">
   <a href="https://w3c.github.io/ServiceWorker/#dom-client-id">https://w3c.github.io/ServiceWorker/#dom-client-id</a><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-dom-client-id">3.2.2. The query() method</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="term-for-site-storage-unit">
   <a href="https://storage.spec.whatwg.org/#site-storage-unit">https://storage.spec.whatwg.org/#site-storage-unit</a><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-site-storage-unit">2.2. Lock Managers</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="term-for-aborterror">
   <a href="https://heycam.github.io/webidl/#aborterror">https://heycam.github.io/webidl/#aborterror</a><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-aborterror">3.2.1. The request() method</a> <a href="#ref-for-aborterror①">(2)</a> <a href="#ref-for-aborterror②">(3)</a> <a href="#ref-for-aborterror③">(4)</a>
    <li><a href="#ref-for-aborterror④">4.1. Request a lock</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="term-for-idl-DOMException">
   <a href="https://heycam.github.io/webidl/#idl-DOMException">https://heycam.github.io/webidl/#idl-DOMException</a><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-idl-DOMException">3.2.1. The request() method</a> <a href="#ref-for-idl-DOMException①">(2)</a> <a href="#ref-for-idl-DOMException②">(3)</a> <a href="#ref-for-idl-DOMException③">(4)</a> <a href="#ref-for-idl-DOMException④">(5)</a> <a href="#ref-for-idl-DOMException⑤">(6)</a>
    <li><a href="#ref-for-idl-DOMException⑥">3.2.2. The query() method</a>
    <li><a href="#ref-for-idl-DOMException⑦">4.1. Request a lock</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="term-for-idl-DOMString">
   <a href="https://heycam.github.io/webidl/#idl-DOMString">https://heycam.github.io/webidl/#idl-DOMString</a><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-idl-DOMString">3.2. LockManager class</a> <a href="#ref-for-idl-DOMString①">(2)</a> <a href="#ref-for-idl-DOMString②">(3)</a> <a href="#ref-for-idl-DOMString③">(4)</a>
    <li><a href="#ref-for-idl-DOMString④">3.3. Lock class</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="term-for-Exposed">
   <a href="https://heycam.github.io/webidl/#Exposed">https://heycam.github.io/webidl/#Exposed</a><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-Exposed">3.2. LockManager class</a>
    <li><a href="#ref-for-Exposed①">3.3. Lock class</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="term-for-notsupportederror">
   <a href="https://heycam.github.io/webidl/#notsupportederror">https://heycam.github.io/webidl/#notsupportederror</a><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-notsupportederror">3.2.1. The request() method</a> <a href="#ref-for-notsupportederror①">(2)</a> <a href="#ref-for-notsupportederror②">(3)</a> <a href="#ref-for-notsupportederror③">(4)</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="term-for-SecureContext">
   <a href="https://heycam.github.io/webidl/#SecureContext">https://heycam.github.io/webidl/#SecureContext</a><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-SecureContext">3.1. Navigator Mixins</a>
    <li><a href="#ref-for-SecureContext①">3.2. LockManager class</a>
    <li><a href="#ref-for-SecureContext②">3.3. Lock class</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="term-for-securityerror">
   <a href="https://heycam.github.io/webidl/#securityerror">https://heycam.github.io/webidl/#securityerror</a><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-securityerror">3.2.1. The request() method</a>
    <li><a href="#ref-for-securityerror①">3.2.2. The query() method</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="term-for-idl-boolean">
   <a href="https://heycam.github.io/webidl/#idl-boolean">https://heycam.github.io/webidl/#idl-boolean</a><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-idl-boolean">3.2. LockManager class</a> <a href="#ref-for-idl-boolean①">(2)</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="term-for-dfn-callback-function">
   <a href="https://heycam.github.io/webidl/#dfn-callback-function">https://heycam.github.io/webidl/#dfn-callback-function</a><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-dfn-callback-function">3.2.1. The request() method</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="term-for-invoke-a-callback-function">
   <a href="https://heycam.github.io/webidl/#invoke-a-callback-function">https://heycam.github.io/webidl/#invoke-a-callback-function</a><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-invoke-a-callback-function">4.1. Request a lock</a>
    <li><a href="#ref-for-invoke-a-callback-function①">4.4. Process a lock request queue for a given resource name</a>
   </ul>
  </aside>
  <h3 class="no-num no-ref heading settled" id="index-defined-elsewhere"><span class="content">Terms defined by reference</span><a class="self-link" href="#index-defined-elsewhere"></a></h3>
  <ul class="index">
   <li>
    <a data-link-type="biblio">[DOM]</a> defines the following terms:
    <ul>
     <li><span class="dfn-paneled" id="term-for-abortsignal" style="color:initial">AbortSignal</span>
     <li><span class="dfn-paneled" id="term-for-abortsignal-aborted-flag" style="color:initial">aborted flag</span>
     <li><span class="dfn-paneled" id="term-for-abortsignal-add" style="color:initial">add</span>
     <li><span class="dfn-paneled" id="term-for-context-object" style="color:initial">context object</span>
    </ul>
   <li>
    <a data-link-type="biblio">[ecma262]</a> defines the following terms:
    <ul>
     <li><span class="dfn-paneled" id="term-for-agent" style="color:initial">agent</span>
    </ul>
   <li>
    <a data-link-type="biblio">[HTML]</a> defines the following terms:
    <ul>
     <li><span class="dfn-paneled" id="term-for-navigator" style="color:initial">Navigator</span>
     <li><span class="dfn-paneled" id="term-for-workernavigator" style="color:initial">WorkerNavigator</span>
     <li><span class="dfn-paneled" id="term-for-integration-with-the-javascript-agent-cluster-formalism" style="color:initial">agent cluster</span>
     <li><span class="dfn-paneled" id="term-for-browsing-context" style="color:initial">browsing context</span>
     <li><span class="dfn-paneled" id="term-for-enqueue-the-following-steps" style="color:initial">enqueue steps</span>
     <li><span class="dfn-paneled" id="term-for-enqueue-the-following-steps①" style="color:initial">enqueue the following steps</span>
     <li><span class="dfn-paneled" id="term-for-environment-settings-object" style="color:initial">environment settings object</span>
     <li><span class="dfn-paneled" id="term-for-concept-environment-id" style="color:initial">id</span>
     <li><span class="dfn-paneled" id="term-for-dom-localstorage" style="color:initial">localstorage</span>
     <li><span class="dfn-paneled" id="term-for-concept-origin-opaque" style="color:initial">opaque origin</span>
     <li><span class="dfn-paneled" id="term-for-concept-origin" style="color:initial">origin</span>
     <li><span class="dfn-paneled" id="term-for-relevant-settings-object" style="color:initial">relevant settings object</span>
     <li><span class="dfn-paneled" id="term-for-responsible-event-loop" style="color:initial">responsible event loop</span>
     <li><span class="dfn-paneled" id="term-for-starting-a-new-parallel-queue" style="color:initial">starting a new parallel queue</span>
     <li><span class="dfn-paneled" id="term-for-task-source" style="color:initial">task source</span>
    </ul>
   <li>
    <a data-link-type="biblio">[INFRA]</a> defines the following terms:
    <ul>
     <li><span class="dfn-paneled" id="term-for-set-append" style="color:initial">append <small>(for set)</small></span>
     <li><span class="dfn-paneled" id="term-for-assert" style="color:initial">assert</span>
     <li><span class="dfn-paneled" id="term-for-queue-enqueue" style="color:initial">enqueue</span>
     <li><span class="dfn-paneled" id="term-for-map-iterate" style="color:initial">for each <small>(for map)</small></span>
     <li><span class="dfn-paneled" id="term-for-javascript-string" style="color:initial">javascript string</span>
     <li><span class="dfn-paneled" id="term-for-list" style="color:initial">list</span>
     <li><span class="dfn-paneled" id="term-for-ordered-map" style="color:initial">map</span>
     <li><span class="dfn-paneled" id="term-for-list-prepend" style="color:initial">prepend</span>
     <li><span class="dfn-paneled" id="term-for-queue" style="color:initial">queue</span>
     <li><span class="dfn-paneled" id="term-for-list-remove" style="color:initial">remove</span>
     <li><span class="dfn-paneled" id="term-for-ordered-set" style="color:initial">set</span>
    </ul>
   <li>
    <a data-link-type="biblio">[promises-guide]</a> defines the following terms:
    <ul>
     <li><span class="dfn-paneled" id="term-for-a-new-promise" style="color:initial">a new promise</span>
     <li><span class="dfn-paneled" id="term-for-a-promise-rejected-with" style="color:initial">a promise rejected with</span>
     <li><span class="dfn-paneled" id="term-for-reject-promise" style="color:initial">reject</span>
    </ul>
   <li>
    <a data-link-type="biblio">[Service-Workers]</a> defines the following terms:
    <ul>
     <li><span class="dfn-paneled" id="term-for-client" style="color:initial">Client</span>
     <li><span class="dfn-paneled" id="term-for-dom-client-id" style="color:initial">id</span>
    </ul>
   <li>
    <a data-link-type="biblio">[Storage]</a> defines the following terms:
    <ul>
     <li><span class="dfn-paneled" id="term-for-site-storage-unit" style="color:initial">site storage units</span>
    </ul>
   <li>
    <a data-link-type="biblio">[WebIDL]</a> defines the following terms:
    <ul>
     <li><span class="dfn-paneled" id="term-for-aborterror" style="color:initial">AbortError</span>
     <li><span class="dfn-paneled" id="term-for-idl-DOMException" style="color:initial">DOMException</span>
     <li><span class="dfn-paneled" id="term-for-idl-DOMString" style="color:initial">DOMString</span>
     <li><span class="dfn-paneled" id="term-for-Exposed" style="color:initial">Exposed</span>
     <li><span class="dfn-paneled" id="term-for-notsupportederror" style="color:initial">NotSupportedError</span>
     <li><span class="dfn-paneled" id="term-for-SecureContext" style="color:initial">SecureContext</span>
     <li><span class="dfn-paneled" id="term-for-securityerror" style="color:initial">SecurityError</span>
     <li><span class="dfn-paneled" id="term-for-idl-boolean" style="color:initial">boolean</span>
     <li><span class="dfn-paneled" id="term-for-dfn-callback-function" style="color:initial">callback function</span>
     <li><span class="dfn-paneled" id="term-for-invoke-a-callback-function" style="color:initial">invoke</span>
    </ul>
  </ul>
  <h2 class="no-num no-ref heading settled" id="references"><span class="content">References</span><a class="self-link" href="#references"></a></h2>
  <h3 class="no-num no-ref heading settled" id="normative"><span class="content">Normative References</span><a class="self-link" href="#normative"></a></h3>
  <dl>
   <dt id="biblio-dom">[DOM]
   <dd>Anne van Kesteren. <a href="https://dom.spec.whatwg.org/">DOM Standard</a>. Living Standard. URL: <a href="https://dom.spec.whatwg.org/">https://dom.spec.whatwg.org/</a>
   <dt id="biblio-html">[HTML]
   <dd>Anne van Kesteren; et al. <a href="https://html.spec.whatwg.org/multipage/">HTML Standard</a>. Living Standard. URL: <a href="https://html.spec.whatwg.org/multipage/">https://html.spec.whatwg.org/multipage/</a>
   <dt id="biblio-infra">[INFRA]
   <dd>Anne van Kesteren; Domenic Denicola. <a href="https://infra.spec.whatwg.org/">Infra Standard</a>. Living Standard. URL: <a href="https://infra.spec.whatwg.org/">https://infra.spec.whatwg.org/</a>
   <dt id="biblio-promises-guide">[PROMISES-GUIDE]
   <dd>Domenic Denicola. <a href="https://www.w3.org/2001/tag/doc/promises-guide">Writing Promise-Using Specifications</a>. 9 November 2018. TAG Finding. URL: <a href="https://www.w3.org/2001/tag/doc/promises-guide">https://www.w3.org/2001/tag/doc/promises-guide</a>
   <dt id="biblio-rfc2119">[RFC2119]
   <dd>S. Bradner. <a href="https://tools.ietf.org/html/rfc2119">Key words for use in RFCs to Indicate Requirement Levels</a>. March 1997. Best Current Practice. URL: <a href="https://tools.ietf.org/html/rfc2119">https://tools.ietf.org/html/rfc2119</a>
   <dt id="biblio-webidl">[WebIDL]
   <dd>Boris Zbarsky. <a href="https://heycam.github.io/webidl/">Web IDL</a>. 15 December 2016. ED. URL: <a href="https://heycam.github.io/webidl/">https://heycam.github.io/webidl/</a>
  </dl>
  <h3 class="no-num no-ref heading settled" id="informative"><span class="content">Informative References</span><a class="self-link" href="#informative"></a></h3>
  <dl>
   <dt id="biblio-indexeddb-2">[IndexedDB-2]
   <dd>Ali Alabbas; Joshua Bell. <a href="https://www.w3.org/TR/IndexedDB-2/">Indexed Database API 2.0</a>. 30 January 2018. REC. URL: <a href="https://www.w3.org/TR/IndexedDB-2/">https://www.w3.org/TR/IndexedDB-2/</a>
   <dt id="biblio-service-workers">[Service-Workers]
   <dd>Alex Russell; et al. <a href="https://www.w3.org/TR/service-workers-1/">Service Workers 1</a>. 2 November 2017. WD. URL: <a href="https://www.w3.org/TR/service-workers-1/">https://www.w3.org/TR/service-workers-1/</a>
   <dt id="biblio-storage">[Storage]
   <dd>Anne van Kesteren. <a href="https://storage.spec.whatwg.org/">Storage Standard</a>. Living Standard. URL: <a href="https://storage.spec.whatwg.org/">https://storage.spec.whatwg.org/</a>
  </dl>
  <h2 class="no-num no-ref heading settled" id="idl-index"><span class="content">IDL Index</span><a class="self-link" href="#idl-index"></a></h2>
<pre class="idl highlight def">[<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#SecureContext" id="ref-for-SecureContext③"><c- g>SecureContext</c-></a>]
<c- b>interface</c-> <c- b>mixin</c-> <a href="#navigatorlocks"><code><c- g>NavigatorLocks</c-></code></a> {
  <c- b>readonly</c-> <c- b>attribute</c-> <a class="n" data-link-type="idl-name" href="#lockmanager" id="ref-for-lockmanager①①"><c- n>LockManager</c-></a> <a data-readonly data-type="LockManager" href="#dom-navigatorlocks-locks"><code><c- g>locks</c-></code></a>;
};
<a class="n" data-link-type="idl-name" href="https://html.spec.whatwg.org/multipage/system-state.html#navigator" id="ref-for-navigator①"><c- n>Navigator</c-></a> <c- b>includes</c-> <a class="n" data-link-type="idl-name" href="#navigatorlocks" id="ref-for-navigatorlocks②"><c- n>NavigatorLocks</c-></a>;
<a class="n" data-link-type="idl-name" href="https://html.spec.whatwg.org/multipage/workers.html#workernavigator" id="ref-for-workernavigator①"><c- n>WorkerNavigator</c-></a> <c- b>includes</c-> <a class="n" data-link-type="idl-name" href="#navigatorlocks" id="ref-for-navigatorlocks①①"><c- n>NavigatorLocks</c-></a>;

[<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#SecureContext" id="ref-for-SecureContext①①"><c- g>SecureContext</c-></a>, <a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#Exposed" id="ref-for-Exposed②"><c- g>Exposed</c-></a>=(<c- n>Window</c->,<c- n>Worker</c->)]
<c- b>interface</c-> <a href="#lockmanager"><code><c- g>LockManager</c-></code></a> {
  <c- b>Promise</c->&lt;<c- b>any</c->> <a class="idl-code" data-link-type="method" href="#dom-lockmanager-request" id="ref-for-dom-lockmanager-request①①"><c- g>request</c-></a>(<a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-DOMString" id="ref-for-idl-DOMString⑤"><c- b>DOMString</c-></a> <a href="#dom-lockmanager-request-name-callback-name"><code><c- g>name</c-></code></a>,
                       <a class="n" data-link-type="idl-name" href="#callbackdef-lockgrantedcallback" id="ref-for-callbackdef-lockgrantedcallback②"><c- n>LockGrantedCallback</c-></a> <a href="#dom-lockmanager-request-name-callback-callback"><code><c- g>callback</c-></code></a>);
  <c- b>Promise</c->&lt;<c- b>any</c->> <a class="idl-code" data-link-type="method" href="#dom-lockmanager-request-name-options-callback" id="ref-for-dom-lockmanager-request-name-options-callback②"><c- g>request</c-></a>(<a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-DOMString" id="ref-for-idl-DOMString①①"><c- b>DOMString</c-></a> <a href="#dom-lockmanager-request-name-options-callback-name"><code><c- g>name</c-></code></a>,
                       <a class="n" data-link-type="idl-name" href="#dictdef-lockoptions" id="ref-for-dictdef-lockoptions②"><c- n>LockOptions</c-></a> <a href="#dom-lockmanager-request-name-options-callback-options"><code><c- g>options</c-></code></a>,
                       <a class="n" data-link-type="idl-name" href="#callbackdef-lockgrantedcallback" id="ref-for-callbackdef-lockgrantedcallback①①"><c- n>LockGrantedCallback</c-></a> <a href="#dom-lockmanager-request-name-options-callback-callback"><code><c- g>callback</c-></code></a>);

  <c- b>Promise</c->&lt;<a class="n" data-link-type="idl-name" href="#dictdef-lockmanagersnapshot" id="ref-for-dictdef-lockmanagersnapshot①"><c- n>LockManagerSnapshot</c-></a>> <a class="idl-code" data-link-type="method" href="#dom-lockmanager-query" id="ref-for-dom-lockmanager-query④"><c- g>query</c-></a>();
};

<c- b>callback</c-> <a href="#callbackdef-lockgrantedcallback"><code><c- g>LockGrantedCallback</c-></code></a> = <c- b>Promise</c->&lt;<c- b>any</c->> (<a class="n" data-link-type="idl-name" href="#lock" id="ref-for-lock⑤"><c- n>Lock</c-></a>? <a href="#dom-lockgrantedcallback-lock"><code><c- g>lock</c-></code></a>);

<c- b>enum</c-> <a href="#enumdef-lockmode"><code><c- g>LockMode</c-></code></a> { <a href="#dom-lockmode-shared"><code><c- s>"shared"</c-></code></a>, <a href="#dom-lockmode-exclusive"><code><c- s>"exclusive"</c-></code></a> };

<c- b>dictionary</c-> <a href="#dictdef-lockoptions"><code><c- g>LockOptions</c-></code></a> {
  <a class="n" data-link-type="idl-name" href="#enumdef-lockmode" id="ref-for-enumdef-lockmode③"><c- n>LockMode</c-></a> <a data-default="&quot;exclusive&quot;" data-type="LockMode " href="#dom-lockoptions-mode"><code><c- g>mode</c-></code></a> = "exclusive";
  <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-boolean" id="ref-for-idl-boolean②"><c- b>boolean</c-></a> <a data-default="false" data-type="boolean " href="#dom-lockoptions-ifavailable"><code><c- g>ifAvailable</c-></code></a> = <c- b>false</c->;
  <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-boolean" id="ref-for-idl-boolean①①"><c- b>boolean</c-></a> <a data-default="false" data-type="boolean " href="#dom-lockoptions-steal"><code><c- g>steal</c-></code></a> = <c- b>false</c->;
  <a class="n" data-link-type="idl-name" href="https://dom.spec.whatwg.org/#abortsignal" id="ref-for-abortsignal②"><c- n>AbortSignal</c-></a> <a data-type="AbortSignal " href="#dom-lockoptions-signal"><code><c- g>signal</c-></code></a>;
};

<c- b>dictionary</c-> <a href="#dictdef-lockmanagersnapshot"><code><c- g>LockManagerSnapshot</c-></code></a> {
  <c- b>sequence</c->&lt;<a class="n" data-link-type="idl-name" href="#dictdef-lockinfo" id="ref-for-dictdef-lockinfo②"><c- n>LockInfo</c-></a>> <a data-type="sequence<LockInfo> " href="#dom-lockmanagersnapshot-held"><code><c- g>held</c-></code></a>;
  <c- b>sequence</c->&lt;<a class="n" data-link-type="idl-name" href="#dictdef-lockinfo" id="ref-for-dictdef-lockinfo①①"><c- n>LockInfo</c-></a>> <a data-type="sequence<LockInfo> " href="#dom-lockmanagersnapshot-pending"><code><c- g>pending</c-></code></a>;
};

<c- b>dictionary</c-> <a href="#dictdef-lockinfo"><code><c- g>LockInfo</c-></code></a> {
  <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-DOMString" id="ref-for-idl-DOMString②①"><c- b>DOMString</c-></a> <a data-type="DOMString " href="#dom-lockinfo-name"><code><c- g>name</c-></code></a>;
  <a class="n" data-link-type="idl-name" href="#enumdef-lockmode" id="ref-for-enumdef-lockmode①①"><c- n>LockMode</c-></a> <a data-type="LockMode " href="#dom-lockinfo-mode"><code><c- g>mode</c-></code></a>;
  <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-DOMString" id="ref-for-idl-DOMString③①"><c- b>DOMString</c-></a> <a data-type="DOMString " href="#dom-lockinfo-clientid"><code><c- g>clientId</c-></code></a>;
};

[<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#SecureContext" id="ref-for-SecureContext②①"><c- g>SecureContext</c-></a>, <a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#Exposed" id="ref-for-Exposed①①"><c- g>Exposed</c-></a>=(<c- n>Window</c->,<c- n>Worker</c->)]
<c- b>interface</c-> <a href="#lock"><code><c- g>Lock</c-></code></a> {
  <c- b>readonly</c-> <c- b>attribute</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-DOMString" id="ref-for-idl-DOMString④①"><c- b>DOMString</c-></a> <a data-readonly data-type="DOMString" href="#dom-lock-name"><code><c- g>name</c-></code></a>;
  <c- b>readonly</c-> <c- b>attribute</c-> <a class="n" data-link-type="idl-name" href="#enumdef-lockmode" id="ref-for-enumdef-lockmode②①"><c- n>LockMode</c-></a> <a data-readonly data-type="LockMode" href="#dom-lock-mode"><code><c- g>mode</c-></code></a>;
};

</pre>
  <h2 class="no-num no-ref heading settled" id="issues-index"><span class="content">Issues Index</span><a class="self-link" href="#issues-index"></a></h2>
  <div style="counter-reset:issue">
   <div class="issue"> Migrate this definition to <a data-link-type="biblio" href="#biblio-html">[HTML]</a> or <a data-link-type="biblio" href="#biblio-storage">[Storage]</a> so it can be referenced by other standards. <a href="#issue-fb27f9c9"> ↵ </a></div>
   <div class="issue"> Normative reference for <i>terminates</i>. <a href="#issue-9d75c9d8"> ↵ </a></div>
  </div>
  <aside class="dfn-panel" data-for="lock-task-queue">
   <b><a href="#lock-task-queue">#lock-task-queue</a></b><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-lock-task-queue">2.4. Locks</a>
    <li><a href="#ref-for-lock-task-queue①">2.6. Agent Integration</a>
    <li><a href="#ref-for-lock-task-queue②">3.2.1. The request() method</a>
    <li><a href="#ref-for-lock-task-queue③">3.2.2. The query() method</a>
    <li><a href="#ref-for-lock-task-queue④">4.1. Request a lock</a>
    <li><a href="#ref-for-lock-task-queue⑤">4.2. Release a lock</a>
    <li><a href="#ref-for-lock-task-queue⑥">4.3. Abort a request</a>
    <li><a href="#ref-for-lock-task-queue⑦">4.4. Process a lock request queue for a given resource name</a>
    <li><a href="#ref-for-lock-task-queue⑧">4.5. Snapshot the lock state</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="resource-name">
   <b><a href="#resource-name">#resource-name</a></b><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-resource-name">1. Introduction</a> <a href="#ref-for-resource-name①">(2)</a>
    <li><a href="#ref-for-resource-name②">2.4. Locks</a>
    <li><a href="#ref-for-resource-name③">2.5. Lock Requests</a>
    <li><a href="#ref-for-resource-name④">3.2.1. The request() method</a>
    <li><a href="#ref-for-resource-name⑤">4.2. Release a lock</a>
    <li><a href="#ref-for-resource-name⑥">4.3. Abort a request</a>
    <li><a href="#ref-for-resource-name⑦">6.4. Checklist</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="lock-manager">
   <b><a href="#lock-manager">#lock-manager</a></b><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-lock-manager">2.2. Lock Managers</a>
    <li><a href="#ref-for-lock-manager①">3.2. LockManager class</a>
    <li><a href="#ref-for-lock-manager②">3.2.2. The query() method</a> <a href="#ref-for-lock-manager③">(2)</a>
    <li><a href="#ref-for-lock-manager④">5.1. Deadlocks</a>
    <li><a href="#ref-for-lock-manager⑤">6.1. Lock Scope</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="mode">
   <b><a href="#mode">#mode</a></b><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-mode">1. Introduction</a> <a href="#ref-for-mode①">(2)</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="lock-concept">
   <b><a href="#lock-concept">#lock-concept</a></b><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-lock-concept">1. Introduction</a>
    <li><a href="#ref-for-lock-concept①">2.2. Lock Managers</a>
    <li><a href="#ref-for-lock-concept②">2.4. Locks</a> <a href="#ref-for-lock-concept③">(2)</a> <a href="#ref-for-lock-concept④">(3)</a> <a href="#ref-for-lock-concept⑤">(4)</a> <a href="#ref-for-lock-concept⑥">(5)</a> <a href="#ref-for-lock-concept⑦">(6)</a> <a href="#ref-for-lock-concept⑧">(7)</a> <a href="#ref-for-lock-concept⑨">(8)</a> <a href="#ref-for-lock-concept①⓪">(9)</a>
    <li><a href="#ref-for-lock-concept①①">2.5. Lock Requests</a> <a href="#ref-for-lock-concept①②">(2)</a> <a href="#ref-for-lock-concept①③">(3)</a>
    <li><a href="#ref-for-lock-concept①④">2.6. Agent Integration</a>
    <li><a href="#ref-for-lock-concept①⑤">3.3. Lock class</a> <a href="#ref-for-lock-concept①⑥">(2)</a> <a href="#ref-for-lock-concept①⑦">(3)</a>
    <li><a href="#ref-for-lock-concept①⑧">4.1. Request a lock</a>
    <li><a href="#ref-for-lock-concept①⑨">4.2. Release a lock</a>
    <li><a href="#ref-for-lock-concept②⓪">4.4. Process a lock request queue for a given resource name</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="lock-concept-agent">
   <b><a href="#lock-concept-agent">#lock-concept-agent</a></b><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-lock-concept-agent">2.6. Agent Integration</a>
    <li><a href="#ref-for-lock-concept-agent①">4.4. Process a lock request queue for a given resource name</a> <a href="#ref-for-lock-concept-agent②">(2)</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="lock-concept-clientid">
   <b><a href="#lock-concept-clientid">#lock-concept-clientid</a></b><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-lock-concept-clientid">4.4. Process a lock request queue for a given resource name</a>
    <li><a href="#ref-for-lock-concept-clientid①">4.5. Snapshot the lock state</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="lock-concept-origin">
   <b><a href="#lock-concept-origin">#lock-concept-origin</a></b><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-lock-concept-origin">4.2. Release a lock</a>
    <li><a href="#ref-for-lock-concept-origin①">4.4. Process a lock request queue for a given resource name</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="lock-concept-name">
   <b><a href="#lock-concept-name">#lock-concept-name</a></b><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-lock-concept-name">2.5. Lock Requests</a> <a href="#ref-for-lock-concept-name①">(2)</a>
    <li><a href="#ref-for-lock-concept-name②">3.3. Lock class</a>
    <li><a href="#ref-for-lock-concept-name③">4.1. Request a lock</a>
    <li><a href="#ref-for-lock-concept-name④">4.4. Process a lock request queue for a given resource name</a>
    <li><a href="#ref-for-lock-concept-name⑤">4.5. Snapshot the lock state</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="lock-concept-mode">
   <b><a href="#lock-concept-mode">#lock-concept-mode</a></b><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-lock-concept-mode">2.5. Lock Requests</a>
    <li><a href="#ref-for-lock-concept-mode①">3.3. Lock class</a>
    <li><a href="#ref-for-lock-concept-mode②">4.4. Process a lock request queue for a given resource name</a>
    <li><a href="#ref-for-lock-concept-mode③">4.5. Snapshot the lock state</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="lock-concept-waiting-promise">
   <b><a href="#lock-concept-waiting-promise">#lock-concept-waiting-promise</a></b><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-lock-concept-waiting-promise">2.4. Locks</a> <a href="#ref-for-lock-concept-waiting-promise①">(2)</a> <a href="#ref-for-lock-concept-waiting-promise②">(3)</a> <a href="#ref-for-lock-concept-waiting-promise③">(4)</a> <a href="#ref-for-lock-concept-waiting-promise④">(5)</a>
    <li><a href="#ref-for-lock-concept-waiting-promise⑤">4.4. Process a lock request queue for a given resource name</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="lock-concept-released-promise">
   <b><a href="#lock-concept-released-promise">#lock-concept-released-promise</a></b><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-lock-concept-released-promise">2.4. Locks</a> <a href="#ref-for-lock-concept-released-promise①">(2)</a> <a href="#ref-for-lock-concept-released-promise②">(3)</a> <a href="#ref-for-lock-concept-released-promise③">(4)</a>
    <li><a href="#ref-for-lock-concept-released-promise④">3.2.1. The request() method</a>
    <li><a href="#ref-for-lock-concept-released-promise⑤">4.1. Request a lock</a>
    <li><a href="#ref-for-lock-concept-released-promise⑥">4.4. Process a lock request queue for a given resource name</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="lock-concept-held-lock-set">
   <b><a href="#lock-concept-held-lock-set">#lock-concept-held-lock-set</a></b><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-lock-concept-held-lock-set">2.5. Lock Requests</a>
    <li><a href="#ref-for-lock-concept-held-lock-set①">4.1. Request a lock</a>
    <li><a href="#ref-for-lock-concept-held-lock-set②">4.2. Release a lock</a>
    <li><a href="#ref-for-lock-concept-held-lock-set③">4.4. Process a lock request queue for a given resource name</a>
    <li><a href="#ref-for-lock-concept-held-lock-set④">4.5. Snapshot the lock state</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="lock-request">
   <b><a href="#lock-request">#lock-request</a></b><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-lock-request">1. Introduction</a>
    <li><a href="#ref-for-lock-request①">2.2. Lock Managers</a>
    <li><a href="#ref-for-lock-request②">2.5. Lock Requests</a> <a href="#ref-for-lock-request③">(2)</a> <a href="#ref-for-lock-request④">(3)</a> <a href="#ref-for-lock-request⑤">(4)</a> <a href="#ref-for-lock-request⑥">(5)</a>
    <li><a href="#ref-for-lock-request⑦">2.6. Agent Integration</a>
    <li><a href="#ref-for-lock-request⑧">3.2. LockManager class</a>
    <li><a href="#ref-for-lock-request⑨">4.1. Request a lock</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="lock-request-agent">
   <b><a href="#lock-request-agent">#lock-request-agent</a></b><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-lock-request-agent">2.6. Agent Integration</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="lock-request-clientid">
   <b><a href="#lock-request-clientid">#lock-request-clientid</a></b><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-lock-request-clientid">4.4. Process a lock request queue for a given resource name</a>
    <li><a href="#ref-for-lock-request-clientid①">4.5. Snapshot the lock state</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="lock-request-origin">
   <b><a href="#lock-request-origin">#lock-request-origin</a></b><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-lock-request-origin">2.5. Lock Requests</a>
    <li><a href="#ref-for-lock-request-origin①">4.3. Abort a request</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="lock-request-name">
   <b><a href="#lock-request-name">#lock-request-name</a></b><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-lock-request-name">2.5. Lock Requests</a>
    <li><a href="#ref-for-lock-request-name①">4.4. Process a lock request queue for a given resource name</a>
    <li><a href="#ref-for-lock-request-name②">4.5. Snapshot the lock state</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="lock-request-mode">
   <b><a href="#lock-request-mode">#lock-request-mode</a></b><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-lock-request-mode">2.5. Lock Requests</a>
    <li><a href="#ref-for-lock-request-mode①">4.4. Process a lock request queue for a given resource name</a>
    <li><a href="#ref-for-lock-request-mode②">4.5. Snapshot the lock state</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="lock-request-promise">
   <b><a href="#lock-request-promise">#lock-request-promise</a></b><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-lock-request-promise">4.4. Process a lock request queue for a given resource name</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="lock-request-lock-request-queue">
   <b><a href="#lock-request-lock-request-queue">#lock-request-lock-request-queue</a></b><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-lock-request-lock-request-queue">2.5. Lock Requests</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="lock-request-lock-request-queue-map">
   <b><a href="#lock-request-lock-request-queue-map">#lock-request-lock-request-queue-map</a></b><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-lock-request-lock-request-queue-map">2.5. Lock Requests</a>
    <li><a href="#ref-for-lock-request-lock-request-queue-map①">4.1. Request a lock</a>
    <li><a href="#ref-for-lock-request-lock-request-queue-map②">4.2. Release a lock</a>
    <li><a href="#ref-for-lock-request-lock-request-queue-map③">4.3. Abort a request</a>
    <li><a href="#ref-for-lock-request-lock-request-queue-map④">4.5. Snapshot the lock state</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="lock-request-grantable">
   <b><a href="#lock-request-grantable">#lock-request-grantable</a></b><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-lock-request-grantable">4.1. Request a lock</a>
    <li><a href="#ref-for-lock-request-grantable①">4.4. Process a lock request queue for a given resource name</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="navigatorlocks">
   <b><a href="#navigatorlocks">#navigatorlocks</a></b><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-navigatorlocks">3.1. Navigator Mixins</a> <a href="#ref-for-navigatorlocks①">(2)</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="dom-navigatorlocks-locks">
   <b><a href="#dom-navigatorlocks-locks">#dom-navigatorlocks-locks</a></b><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-dom-navigatorlocks-locks">3.1. Navigator Mixins</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="lockmanager">
   <b><a href="#lockmanager">#lockmanager</a></b><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-lockmanager">2.4. Locks</a>
    <li><a href="#ref-for-lockmanager①">3.1. Navigator Mixins</a> <a href="#ref-for-lockmanager②">(2)</a> <a href="#ref-for-lockmanager③">(3)</a>
    <li><a href="#ref-for-lockmanager④">3.2. LockManager class</a> <a href="#ref-for-lockmanager⑤">(2)</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="callbackdef-lockgrantedcallback">
   <b><a href="#callbackdef-lockgrantedcallback">#callbackdef-lockgrantedcallback</a></b><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-callbackdef-lockgrantedcallback">3.2. LockManager class</a> <a href="#ref-for-callbackdef-lockgrantedcallback①">(2)</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="enumdef-lockmode">
   <b><a href="#enumdef-lockmode">#enumdef-lockmode</a></b><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-enumdef-lockmode">3.2. LockManager class</a> <a href="#ref-for-enumdef-lockmode①">(2)</a>
    <li><a href="#ref-for-enumdef-lockmode②">3.3. Lock class</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="dom-lockmode-shared">
   <b><a href="#dom-lockmode-shared">#dom-lockmode-shared</a></b><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-dom-lockmode-shared">2.3. Modes and Scheduling</a> <a href="#ref-for-dom-lockmode-shared①">(2)</a> <a href="#ref-for-dom-lockmode-shared②">(3)</a>
    <li><a href="#ref-for-dom-lockmode-shared③">2.4. Locks</a>
    <li><a href="#ref-for-dom-lockmode-shared④">2.5. Lock Requests</a>
    <li><a href="#ref-for-dom-lockmode-shared⑤">3.2.1. The request() method</a> <a href="#ref-for-dom-lockmode-shared⑥">(2)</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="dom-lockmode-exclusive">
   <b><a href="#dom-lockmode-exclusive">#dom-lockmode-exclusive</a></b><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-dom-lockmode-exclusive">2.3. Modes and Scheduling</a> <a href="#ref-for-dom-lockmode-exclusive①">(2)</a> <a href="#ref-for-dom-lockmode-exclusive②">(3)</a> <a href="#ref-for-dom-lockmode-exclusive③">(4)</a>
    <li><a href="#ref-for-dom-lockmode-exclusive④">2.4. Locks</a>
    <li><a href="#ref-for-dom-lockmode-exclusive⑤">2.5. Lock Requests</a> <a href="#ref-for-dom-lockmode-exclusive⑥">(2)</a>
    <li><a href="#ref-for-dom-lockmode-exclusive⑦">3.2.1. The request() method</a> <a href="#ref-for-dom-lockmode-exclusive⑧">(2)</a> <a href="#ref-for-dom-lockmode-exclusive⑨">(3)</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="dictdef-lockoptions">
   <b><a href="#dictdef-lockoptions">#dictdef-lockoptions</a></b><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-dictdef-lockoptions">3.2. LockManager class</a>
    <li><a href="#ref-for-dictdef-lockoptions①">3.2.1. The request() method</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="dom-lockoptions-mode">
   <b><a href="#dom-lockoptions-mode">#dom-lockoptions-mode</a></b><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-dom-lockoptions-mode">3.2.1. The request() method</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="dom-lockoptions-ifavailable">
   <b><a href="#dom-lockoptions-ifavailable">#dom-lockoptions-ifavailable</a></b><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-dom-lockoptions-ifavailable">3.2.1. The request() method</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="dom-lockoptions-steal">
   <b><a href="#dom-lockoptions-steal">#dom-lockoptions-steal</a></b><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-dom-lockoptions-steal">3.2.1. The request() method</a> <a href="#ref-for-dom-lockoptions-steal①">(2)</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="dom-lockoptions-signal">
   <b><a href="#dom-lockoptions-signal">#dom-lockoptions-signal</a></b><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-dom-lockoptions-signal">3.2.1. The request() method</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="dictdef-lockmanagersnapshot">
   <b><a href="#dictdef-lockmanagersnapshot">#dictdef-lockmanagersnapshot</a></b><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-dictdef-lockmanagersnapshot">3.2. LockManager class</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="dictdef-lockinfo">
   <b><a href="#dictdef-lockinfo">#dictdef-lockinfo</a></b><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-dictdef-lockinfo">3.2. LockManager class</a> <a href="#ref-for-dictdef-lockinfo①">(2)</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="dom-lockmanager-request">
   <b><a href="#dom-lockmanager-request">#dom-lockmanager-request</a></b><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-dom-lockmanager-request">2.4. Locks</a>
    <li><a href="#ref-for-dom-lockmanager-request①">3.2. LockManager class</a>
    <li><a href="#ref-for-dom-lockmanager-request②">3.2.1. The request() method</a> <a href="#ref-for-dom-lockmanager-request③">(2)</a> <a href="#ref-for-dom-lockmanager-request④">(3)</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="dom-lockmanager-request-name-options-callback">
   <b><a href="#dom-lockmanager-request-name-options-callback">#dom-lockmanager-request-name-options-callback</a></b><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-dom-lockmanager-request-name-options-callback">3.2. LockManager class</a>
    <li><a href="#ref-for-dom-lockmanager-request-name-options-callback①">3.2.1. The request() method</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="dom-lockmanager-query">
   <b><a href="#dom-lockmanager-query">#dom-lockmanager-query</a></b><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-dom-lockmanager-query">3.2. LockManager class</a>
    <li><a href="#ref-for-dom-lockmanager-query①">3.2.2. The query() method</a> <a href="#ref-for-dom-lockmanager-query②">(2)</a> <a href="#ref-for-dom-lockmanager-query③">(3)</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="lock">
   <b><a href="#lock">#lock</a></b><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-lock">3.2. LockManager class</a>
    <li><a href="#ref-for-lock①">3.2.1. The request() method</a>
    <li><a href="#ref-for-lock②">3.3. Lock class</a> <a href="#ref-for-lock③">(2)</a>
    <li><a href="#ref-for-lock④">4.4. Process a lock request queue for a given resource name</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="dom-lock-name">
   <b><a href="#dom-lock-name">#dom-lock-name</a></b><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-dom-lock-name">3.3. Lock class</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="dom-lock-mode">
   <b><a href="#dom-lock-mode">#dom-lock-mode</a></b><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-dom-lock-mode">3.3. Lock class</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="request-a-lock">
   <b><a href="#request-a-lock">#request-a-lock</a></b><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-request-a-lock">3.2.1. The request() method</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="release-the-lock">
   <b><a href="#release-the-lock">#release-the-lock</a></b><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-release-the-lock">2.4. Locks</a>
    <li><a href="#ref-for-release-the-lock①">2.6. Agent Integration</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="abort-the-request">
   <b><a href="#abort-the-request">#abort-the-request</a></b><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-abort-the-request">2.6. Agent Integration</a>
    <li><a href="#ref-for-abort-the-request①">3.2.1. The request() method</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="process-the-lock-request-queue">
   <b><a href="#process-the-lock-request-queue">#process-the-lock-request-queue</a></b><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-process-the-lock-request-queue">4.1. Request a lock</a>
    <li><a href="#ref-for-process-the-lock-request-queue①">4.2. Release a lock</a>
    <li><a href="#ref-for-process-the-lock-request-queue②">4.3. Abort a request</a>
   </ul>
  </aside>
  <aside class="dfn-panel" data-for="snapshot-the-lock-state">
   <b><a href="#snapshot-the-lock-state">#snapshot-the-lock-state</a></b><b>Referenced in:</b>
   <ul>
    <li><a href="#ref-for-snapshot-the-lock-state">3.2.2. The query() method</a>
   </ul>
  </aside>
<script>/* script-dfn-panel */

document.body.addEventListener("click", function(e) {
    var queryAll = function(sel) { return [].slice.call(document.querySelectorAll(sel)); }
    // Find the dfn element or panel, if any, that was clicked on.
    var el = e.target;
    var target;
    var hitALink = false;
    while(el.parentElement) {
        if(el.tagName == "A") {
            // Clicking on a link in a <dfn> shouldn't summon the panel
            hitALink = true;
        }
        if(el.classList.contains("dfn-paneled")) {
            target = "dfn";
            break;
        }
        if(el.classList.contains("dfn-panel")) {
            target = "dfn-panel";
            break;
        }
        el = el.parentElement;
    }
    if(target != "dfn-panel") {
        // Turn off any currently "on" or "activated" panels.
        queryAll(".dfn-panel.on, .dfn-panel.activated").forEach(function(el){
            el.classList.remove("on");
            el.classList.remove("activated");
        });
    }
    if(target == "dfn" && !hitALink) {
        // open the panel
        var dfnPanel = document.querySelector(".dfn-panel[data-for='" + el.id + "']");
        if(dfnPanel) {
            dfnPanel.classList.add("on");
            var rect = el.getBoundingClientRect();
            dfnPanel.style.left = window.scrollX + rect.right + 5 + "px";
            dfnPanel.style.top = window.scrollY + rect.top + "px";
            var panelRect = dfnPanel.getBoundingClientRect();
            var panelWidth = panelRect.right - panelRect.left;
            if(panelRect.right > document.body.scrollWidth && (rect.left - (panelWidth + 5)) > 0) {
                // Reposition, because the panel is overflowing
                dfnPanel.style.left = window.scrollX + rect.left - (panelWidth + 5) + "px";
            }
        } else {
            console.log("Couldn't find .dfn-panel[data-for='" + el.id + "']");
        }
    } else if(target == "dfn-panel") {
        // Switch it to "activated" state, which pins it.
        el.classList.add("activated");
        el.style.left = null;
        el.style.top = null;
    }

});
</script>